feat: renderer tweaks (#6698)

src/scene/Shape.ts

@@ -13,11 +13,21 @@ import { isPathALoop, getCornerRadius } from "../math";
 import { generateFreeDrawShape } from "../renderer/renderElement";
 import { isTransparent, assertNever } from "../utils";
 import { simplify } from "points-on-curve";
+import { ROUGHNESS } from "../constants";
 
 const getDashArrayDashed = (strokeWidth: number) => [8, 8 + strokeWidth];
 
 const getDashArrayDotted = (strokeWidth: number) => [1.5, 6 + strokeWidth];
 
+function adjustRoughness(size: number, roughness: number): number {
+  if (size >= 50) {
+    return roughness;
+  }
+  const factor = 2 + (50 - size) / 10;
+
+  return roughness / factor;
+}
+
 export const generateRoughOptions = (
   element: ExcalidrawElement,
   continuousPath = false,
@@ -44,9 +54,13 @@ export const generateRoughOptions = (
     // calculate them (and we don't want the fills to be modified)
     fillWeight: element.strokeWidth / 2,
     hachureGap: element.strokeWidth * 4,
-    roughness: element.roughness,
+    roughness: adjustRoughness(
+      Math.min(element.width, element.height),
+      element.roughness,
+    ),
     stroke: element.strokeColor,
-    preserveVertices: continuousPath,
+    preserveVertices:
+      continuousPath || element.roughness < ROUGHNESS.cartoonist,
   };
 
   switch (element.type) {