diff --git a/packages/element/src/elbowArrow.ts b/packages/element/src/elbowArrow.ts index 74e64fa64..b9c602b9b 100644 --- a/packages/element/src/elbowArrow.ts +++ b/packages/element/src/elbowArrow.ts @@ -107,7 +107,10 @@ type ElbowArrowData = { hoveredEndElement: ExcalidrawBindableElement | null; }; -const DEDUP_TRESHOLD = 1; +const calculateDedupTreshhold = ( + a: Point, + b: Point, +) => 1 + pointDistance(a, b) / 100; const calculatePadding = ( aabb: Bounds, @@ -117,8 +120,8 @@ const calculatePadding = ( const width = aabb[2] - aabb[0]; const height = aabb[3] - aabb[1]; const size = Math.max(width, height); - // || compareHeading(startHeading, flipHeading(endHeading)) - return size > 55 + + return size > 75 ? 40 : Math.min( Math.max( @@ -207,7 +210,11 @@ const handleSegmentRenormalization = ( if ( // Remove segments that are too short - pointDistance(points[i - 2], points[i - 1]) < DEDUP_TRESHOLD + pointDistance(points[i - 2], points[i - 1]) < + calculateDedupTreshhold( + points[i - 3] ?? points[i - 3], + points[i] ?? points[i - 1], + ) ) { const prevPrevSegmentIdx = nextFixedSegments?.findIndex((segment) => segment.index === i - 2) ?? @@ -2228,7 +2235,10 @@ const removeElbowArrowShortSegments = ( const prev = points[idx - 1]; const prevDist = pointDistance(prev, p); - return prevDist > DEDUP_TRESHOLD; + return ( + prevDist > + calculateDedupTreshhold(points[idx - 2] ?? prev, points[idx + 1] ?? p) + ); }); } @@ -2333,13 +2343,16 @@ const gridAddressesEqual = (a: GridAddress, b: GridAddress): boolean => export const validateElbowPoints =

( points: readonly P[], - tolerance: number = DEDUP_TRESHOLD, + tolerance?: number, ) => points .slice(1) - .map( - (p, i) => - Math.abs(p[0] - points[i][0]) < tolerance || - Math.abs(p[1] - points[i][1]) < tolerance, - ) + .map((p, i) => { + const t = + tolerance ?? + calculateDedupTreshhold(points[i - 1] ?? points[i], points[i + 2] ?? p); + return ( + Math.abs(p[0] - points[i][0]) < t || Math.abs(p[1] - points[i][1]) < t + ); + }) .every(Boolean); diff --git a/packages/element/tests/elbowArrow.test.tsx b/packages/element/tests/elbowArrow.test.tsx index bb49d063b..1c3d8cf6e 100644 --- a/packages/element/tests/elbowArrow.test.tsx +++ b/packages/element/tests/elbowArrow.test.tsx @@ -294,11 +294,11 @@ describe("elbow arrow ui", () => { ) as HTMLInputElement; UI.updateInput(inputAngle, String("40")); - expect(arrow.points.map((point) => point.map(Math.round))).toEqual([ + expect(arrow.points).toCloselyEqualPoints([ [0, 0], - [34, 0], - [34, 165], - [104, 165], + [34.9292, 0], + [34.48768, 164.6246], + [104.333, 164.6246], ]); });