gilles/excalidraw
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: Bisect tangent-based control point positions

Browse Source 
Signed-off-by: Mark Tolmacs <mark@lazycat.hu>
This commit is contained in:
Mark Tolmacs
2026-03-22 13:17:46 +00:00
parent 62aa998f9a
commit d04eef5a37
3 changed files with 337 additions and 111 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/element/src/shape.ts
+299 -67
View File
@@ -13,6 +13,7 @@ import {
import { import {
pointFrom, pointFrom,
pointDistance, pointDistance,
lineSegment,
type LocalPoint, type LocalPoint,
pointRotateRads, pointRotateRads,
} from "@excalidraw/math"; } from "@excalidraw/math";
@@ -43,6 +44,7 @@ import type {
} from "@excalidraw/excalidraw/scene/types"; } from "@excalidraw/excalidraw/scene/types";
import { elementWithCanvasCache } from "./renderElement"; import { elementWithCanvasCache } from "./renderElement";
import { debugDrawLine, debugDrawPoint, debugDrawPolygon } from "./visualdebug";
import { import {
canBecomePolygon, canBecomePolygon,
@@ -78,6 +80,9 @@ import type {
import type { Drawable, Options } from "roughjs/bin/core"; import type { Drawable, Options } from "roughjs/bin/core";
import type { Point as RoughPoint } from "roughjs/bin/geometry"; import type { Point as RoughPoint } from "roughjs/bin/geometry";
const SIMPLE_ROUNDED_ARROW_ENDPOINT_ANGLE_SCALE = 0.3;
const SIMPLE_ROUNDED_ARROW_CP_LENGTH_RATIO = 1 / 4;
export class ShapeCache { export class ShapeCache {
private static rg = new RoughGenerator(); private static rg = new RoughGenerator();
private static cache = new WeakMap< private static cache = new WeakMap<
@@ -625,9 +630,8 @@ export const generateLinearCollisionShape = (
}); });
} }
// Generate collision ops using the same Catmull-Rom → cubic Bézier // Generate collision ops using the same bisector-based cubic Bézier
// algorithm as generateSimpleArrowShape so hit-testing matches rendering. // algorithm as generateRoundedSimpleArrowShape so hit-testing matches rendering.
const tension = 0.5;
const rotateLocal = (lx: number, ly: number): LocalPoint => { const rotateLocal = (lx: number, ly: number): LocalPoint => {
const g = pointRotateRads<GlobalPoint>( const g = pointRotateRads<GlobalPoint>(
pointFrom<GlobalPoint>(element.x + lx, element.y + ly), pointFrom<GlobalPoint>(element.x + lx, element.y + ly),
@@ -653,32 +657,81 @@ export const generateLinearCollisionShape = (
}); });
} else { } else {
const n = points.length; const n = points.length;
const ptx = new Float64Array(n); const ptxn = new Float64Array(n);
const pty = new Float64Array(n); const ptyn = new Float64Array(n);
for (let i = 0; i < n; i++) {
if (i === 0) { for (let i = 1; i < n - 1; i++) {
const pbx = 3 * points[0][0] - 3 * points[1][0] + points[2][0]; const inDx = points[i][0] - points[i - 1][0];
const pby = 3 * points[0][1] - 3 * points[1][1] + points[2][1]; const inDy = points[i][1] - points[i - 1][1];
ptx[i] = tension * (points[1][0] - pbx); const inLen = Math.hypot(inDx, inDy);
pty[i] = tension * (points[1][1] - pby); const inUx = inDx / inLen;
} else if (i === n - 1) { const inUy = inDy / inLen;
const pax = const outDx = points[i + 1][0] - points[i][0];
3 * points[n - 1][0] - 3 * points[n - 2][0] + points[n - 3][0]; const outDy = points[i + 1][1] - points[i][1];
const pay = const outLen = Math.hypot(outDx, outDy);
3 * points[n - 1][1] - 3 * points[n - 2][1] + points[n - 3][1]; const outUx = outDx / outLen;
ptx[i] = tension * (pax - points[n - 2][0]); const outUy = outDy / outLen;
pty[i] = tension * (pay - points[n - 2][1]); const bisDx = inUx + outUx;
const bisDy = inUy + outUy;
const bisLen = Math.hypot(bisDx, bisDy);
let bisUx: number;
let bisUy: number;
if (bisLen > 1e-8) {
bisUx = bisDx / bisLen;
bisUy = bisDy / bisLen;
} else { } else {
ptx[i] = tension * (points[i + 1][0] - points[i - 1][0]); bisUx = -inUy;
pty[i] = tension * (points[i + 1][1] - points[i - 1][1]); bisUy = inUx;
} }
ptxn[i] = bisUx;
ptyn[i] = bisUy;
}
// Endpoints: reflect the adjacent interior tangent across the
// endpoint's chord with specific dampening
{
const cx = points[1][0] - points[0][0];
const cy = points[1][1] - points[0][1];
const cLen = Math.hypot(cx, cy);
const cux = cx / cLen;
const cuy = cy / cLen;
const dot = ptxn[1] * cux + ptyn[1] * cuy;
const rx =
(1 + SIMPLE_ROUNDED_ARROW_ENDPOINT_ANGLE_SCALE) * dot * cux -
SIMPLE_ROUNDED_ARROW_ENDPOINT_ANGLE_SCALE * ptxn[1];
const ry =
(1 + SIMPLE_ROUNDED_ARROW_ENDPOINT_ANGLE_SCALE) * dot * cuy -
SIMPLE_ROUNDED_ARROW_ENDPOINT_ANGLE_SCALE * ptyn[1];
const rLen = Math.hypot(rx, ry);
ptxn[0] = rx / rLen;
ptyn[0] = ry / rLen;
}
{
const cx = points[n - 1][0] - points[n - 2][0];
const cy = points[n - 1][1] - points[n - 2][1];
const cLen = Math.hypot(cx, cy);
const cux = cx / cLen;
const cuy = cy / cLen;
const dot = ptxn[n - 2] * cux + ptyn[n - 2] * cuy;
const rx =
(1 + SIMPLE_ROUNDED_ARROW_ENDPOINT_ANGLE_SCALE) * dot * cux -
SIMPLE_ROUNDED_ARROW_ENDPOINT_ANGLE_SCALE * ptxn[n - 2];
const ry =
(1 + SIMPLE_ROUNDED_ARROW_ENDPOINT_ANGLE_SCALE) * dot * cuy -
SIMPLE_ROUNDED_ARROW_ENDPOINT_ANGLE_SCALE * ptyn[n - 2];
const rLen = Math.hypot(rx, ry);
ptxn[n - 1] = rx / rLen;
ptyn[n - 1] = ry / rLen;
} }
for (let i = 0; i < n - 1; i++) { for (let i = 0; i < n - 1; i++) {
const cp1x = points[i][0] + ptx[i] / 3; const d =
const cp1y = points[i][1] + pty[i] / 3; pointDistance(points[i], points[i + 1]) *
const cp2x = points[i + 1][0] - ptx[i + 1] / 3; SIMPLE_ROUNDED_ARROW_CP_LENGTH_RATIO;
const cp2y = points[i + 1][1] - pty[i + 1] / 3; const cp1x = points[i][0] + ptxn[i] * d;
const cp1y = points[i][1] + ptyn[i] * d;
const cp2x = points[i + 1][0] - ptxn[i + 1] * d;
const cp2y = points[i + 1][1] - ptyn[i + 1] * d;
const rcp1 = rotateLocal(cp1x, cp1y); const rcp1 = rotateLocal(cp1x, cp1y);
const rcp2 = rotateLocal(cp2x, cp2y); const rcp2 = rotateLocal(cp2x, cp2y);
@@ -934,10 +987,13 @@ const _generateElementShape = (
} else { } else {
shape = [ shape = [
generator.path( generator.path(
generateSimpleArrowShape(points, 0.5), generateRoundedSimpleArrowShape(points),
generateRoughOptions(element, true, isDarkMode), generateRoughOptions(element, true, isDarkMode),
), ),
]; ];
if (window.visualDebug?.data) {
debugRoundedArrowControlPoints(element.x, element.y, points);
}
} }
// add lines only in arrow // add lines only in arrow
@@ -1021,9 +1077,151 @@ const _generateElementShape = (
} }
}; };
const generateSimpleArrowShape = ( /**
* Debug helper to visualise chord and control points.
*
* Chords are grey, CP1 handles/circles are green, CP2 handles/diamonds are blue,
* segment points are red X markers.
*/
const debugRoundedArrowControlPoints = (
elementX: number,
elementY: number,
points: readonly LocalPoint[],
) => {
const n = points.length;
if (n < 2) {
return;
}
const g = (lx: number, ly: number): GlobalPoint =>
pointFrom<GlobalPoint>(elementX + lx, elementY + ly);
const PERMANENT = { permanent: true } as const;
const CP_RADIUS = 5;
const DIAMOND_RADIUS = 6;
const txn = new Float64Array(n);
const tyn = new Float64Array(n);
for (let i = 1; i < n - 1; i++) {
const inDx = points[i][0] - points[i - 1][0];
const inDy = points[i][1] - points[i - 1][1];
const inLen = Math.hypot(inDx, inDy);
const inUx = inDx / inLen;
const inUy = inDy / inLen;
const outDx = points[i + 1][0] - points[i][0];
const outDy = points[i + 1][1] - points[i][1];
const outLen = Math.hypot(outDx, outDy);
const outUx = outDx / outLen;
const outUy = outDy / outLen;
const bisDx = inUx + outUx;
const bisDy = inUy + outUy;
const bisLen = Math.hypot(bisDx, bisDy);
let bisUx: number;
let bisUy: number;
if (bisLen > 1e-8) {
bisUx = bisDx / bisLen;
bisUy = bisDy / bisLen;
} else {
bisUx = -inUy;
bisUy = inUx;
}
const bx = bisUx;
const by = bisUy;
const bLen = Math.hypot(bx, by);
txn[i] = bx / bLen;
tyn[i] = by / bLen;
}
// Endpoints: reflect the adjacent interior tangent across the endpoint's own chord.
{
const cx = points[1][0] - points[0][0];
const cy = points[1][1] - points[0][1];
const cLen = Math.hypot(cx, cy);
const cux = cx / cLen;
const cuy = cy / cLen;
const dot = txn[1] * cux + tyn[1] * cuy;
const eas = SIMPLE_ROUNDED_ARROW_ENDPOINT_ANGLE_SCALE;
const rx = (1 + eas) * dot * cux - eas * txn[1];
const ry = (1 + eas) * dot * cuy - eas * tyn[1];
const rLen = Math.hypot(rx, ry);
txn[0] = rx / rLen;
tyn[0] = ry / rLen;
}
{
const cx = points[n - 1][0] - points[n - 2][0];
const cy = points[n - 1][1] - points[n - 2][1];
const cLen = Math.hypot(cx, cy);
const cux = cx / cLen;
const cuy = cy / cLen;
const dot = txn[n - 2] * cux + tyn[n - 2] * cuy;
const eas = SIMPLE_ROUNDED_ARROW_ENDPOINT_ANGLE_SCALE;
const rx = (1 + eas) * dot * cux - eas * txn[n - 2];
const ry = (1 + eas) * dot * cuy - eas * tyn[n - 2];
const rLen = Math.hypot(rx, ry);
txn[n - 1] = rx / rLen;
tyn[n - 1] = ry / rLen;
}
for (let i = 0; i < n - 1; i++) {
const d =
Math.hypot(
points[i + 1][0] - points[i][0],
points[i + 1][1] - points[i][1],
) * SIMPLE_ROUNDED_ARROW_CP_LENGTH_RATIO;
const p0 = g(points[i][0], points[i][1]);
const p1 = g(points[i + 1][0], points[i + 1][1]);
const cp1 = g(points[i][0] + txn[i] * d, points[i][1] + tyn[i] * d);
const cp2 = g(
points[i + 1][0] - txn[i + 1] * d,
points[i + 1][1] - tyn[i + 1] * d,
);
// chord (grey)
debugDrawLine(lineSegment(p0, p1), { color: "#888888", ...PERMANENT });
// CP1 handle + circle (green = outgoing from p0)
debugDrawLine(lineSegment(p0, cp1), {
color: "#00cc44",
...PERMANENT,
});
debugDrawPolygon(
Array.from({ length: 9 }, (_, k) =>
pointFrom<GlobalPoint>(
cp1[0] + Math.cos((k * Math.PI) / 4) * CP_RADIUS,
cp1[1] + Math.sin((k * Math.PI) / 4) * CP_RADIUS,
),
),
{ color: "#00cc44", close: true, ...PERMANENT },
);
// CP2 handle + diamond (blue = incoming to p1)
debugDrawLine(lineSegment(p1, cp2), { color: "#0088ff", ...PERMANENT });
debugDrawPolygon(
[
pointFrom<GlobalPoint>(cp2[0], cp2[1] - DIAMOND_RADIUS),
pointFrom<GlobalPoint>(cp2[0] + DIAMOND_RADIUS, cp2[1]),
pointFrom<GlobalPoint>(cp2[0], cp2[1] + DIAMOND_RADIUS),
pointFrom<GlobalPoint>(cp2[0] - DIAMOND_RADIUS, cp2[1]),
],
{ color: "#0088ff", close: true, ...PERMANENT },
);
}
// Segment points: red X
for (let i = 0; i < n; i++) {
debugDrawPoint(g(points[i][0], points[i][1]), {
color: "#ff3333",
...PERMANENT,
});
}
};
const generateRoundedSimpleArrowShape = (
points: readonly LocalPoint[], points: readonly LocalPoint[],
tension = 0.5,
): string => { ): string => {
if (points.length < 2) { if (points.length < 2) {
return ""; return "";
@@ -1033,54 +1231,88 @@ const generateSimpleArrowShape = (
return `M ${points[0][0]} ${points[0][1]} L ${points[1][0]} ${points[1][1]}`; return `M ${points[0][0]} ${points[0][1]} L ${points[1][0]} ${points[1][1]}`;
} }
// Catmull-Rom spline converted to cubic Bézier segments.
// Tangents are computed from neighboring points (one-sided at endpoints),
// guaranteeing C1 continuity, smooth tangent direction at every data point
// with no pinching at segment joints.
//
// tension=0; straight lines; tension=0.5, standard Catmull-Rom.
const n = points.length; const n = points.length;
const txn = new Float64Array(n);
const tyn = new Float64Array(n);
// Compute tangent vectors at each point. for (let i = 1; i < n - 1; i++) {
const tx = new Float64Array(n); const inDx = points[i][0] - points[i - 1][0];
const ty = new Float64Array(n); const inDy = points[i][1] - points[i - 1][1];
// Quadratic-extrapolation phantom points so endpoints use the same const inLen = Math.hypot(inDx, inDy);
// central-difference formula as interior points, preventing degenerate const inUx = inDx / inLen;
// (chord-parallel) first/last segments. const inUy = inDy / inLen;
// phantom_before = 3*P[0] - 3*P[1] + P[2]
// phantom_after = 3*P[n-1] - 3*P[n-2] + P[n-3] const outDx = points[i + 1][0] - points[i][0];
for (let i = 0; i < n; i++) { const outDy = points[i + 1][1] - points[i][1];
if (i === 0) { const outLen = Math.hypot(outDx, outDy);
const pbx = 3 * points[0][0] - 3 * points[1][0] + points[2][0]; const outUx = outDx / outLen;
const pby = 3 * points[0][1] - 3 * points[1][1] + points[2][1]; const outUy = outDy / outLen;
tx[i] = tension * (points[1][0] - pbx);
ty[i] = tension * (points[1][1] - pby); // Bisector: average of the two incident unit chord vectors
} else if (i === n - 1) { const bisDx = inUx + outUx;
const pax = const bisDy = inUy + outUy;
3 * points[n - 1][0] - 3 * points[n - 2][0] + points[n - 3][0]; const bisLen = Math.hypot(bisDx, bisDy);
const pay = let bisUx: number;
3 * points[n - 1][1] - 3 * points[n - 2][1] + points[n - 3][1]; let bisUy: number;
tx[i] = tension * (pax - points[n - 2][0]); if (bisLen > 1e-8) {
ty[i] = tension * (pay - points[n - 2][1]); bisUx = bisDx / bisLen;
bisUy = bisDy / bisLen;
} else { } else {
tx[i] = tension * (points[i + 1][0] - points[i - 1][0]); // 180° hairpin -> rotate incoming chord 90°
ty[i] = tension * (points[i + 1][1] - points[i - 1][1]); bisUx = -inUy;
bisUy = inUx;
} }
const bx = bisUx;
const by = bisUy;
const bLen = Math.hypot(bx, by);
txn[i] = bx / bLen;
tyn[i] = by / bLen;
}
// Endpoints: reflect the adjacent interior tangent across the endpoint's own chord.
// This mirrors the angle the interior CP makes with the chord, preventing overshoot.
// ENDPOINT_ANGLE_SCALE < 1 reduces the perpendicular deviation, making endpoints more taut.
{
const cx = points[1][0] - points[0][0];
const cy = points[1][1] - points[0][1];
const cLen = Math.hypot(cx, cy);
const cux = cx / cLen;
const cuy = cy / cLen;
const dot = txn[1] * cux + tyn[1] * cuy;
const eas = SIMPLE_ROUNDED_ARROW_ENDPOINT_ANGLE_SCALE;
const rx = (1 + eas) * dot * cux - eas * txn[1];
const ry = (1 + eas) * dot * cuy - eas * tyn[1];
const rLen = Math.hypot(rx, ry);
txn[0] = rx / rLen;
tyn[0] = ry / rLen;
}
{
const cx = points[n - 1][0] - points[n - 2][0];
const cy = points[n - 1][1] - points[n - 2][1];
const cLen = Math.hypot(cx, cy);
const cux = cx / cLen;
const cuy = cy / cLen;
const dot = txn[n - 2] * cux + tyn[n - 2] * cuy;
const eas = SIMPLE_ROUNDED_ARROW_ENDPOINT_ANGLE_SCALE;
const rx = (1 + eas) * dot * cux - eas * txn[n - 2];
const ry = (1 + eas) * dot * cuy - eas * tyn[n - 2];
const rLen = Math.hypot(rx, ry);
txn[n - 1] = rx / rLen;
tyn[n - 1] = ry / rLen;
} }
const path: string[] = [`M ${points[0][0]} ${points[0][1]}`]; const path: string[] = [`M ${points[0][0]} ${points[0][1]}`];
for (let i = 0; i < n - 1; i++) { for (let i = 0; i < n - 1; i++) {
const segLen = pointDistance(points[i], points[i + 1]); const d =
// Clamp each control point offset to at most half the segment length so Math.hypot(
// that curvature decreases linearly to 0 as the two endpoints converge. points[i + 1][0] - points[i][0],
const tanMag1 = Math.sqrt(tx[i] * tx[i] + ty[i] * ty[i]); points[i + 1][1] - points[i][1],
const tanMag2 = Math.sqrt(tx[i + 1] * tx[i + 1] + ty[i + 1] * ty[i + 1]); ) * SIMPLE_ROUNDED_ARROW_CP_LENGTH_RATIO;
const s1 = tanMag1 > 0 ? Math.min(1, (segLen * 1.5) / tanMag1) : 1; const cp1x = points[i][0] + txn[i] * d;
const s2 = tanMag2 > 0 ? Math.min(1, (segLen * 1.5) / tanMag2) : 1; const cp1y = points[i][1] + tyn[i] * d;
const cp1x = points[i][0] + (tx[i] / 3) * s1; const cp2x = points[i + 1][0] - txn[i + 1] * d;
const cp1y = points[i][1] + (ty[i] / 3) * s1; const cp2y = points[i + 1][1] - tyn[i + 1] * d;
const cp2x = points[i + 1][0] - (tx[i + 1] / 3) * s2;
const cp2y = points[i + 1][1] - (ty[i + 1] / 3) * s2;
path.push( path.push(
`C ${cp1x} ${cp1y} ${cp2x} ${cp2y} ${points[i + 1][0]} ${ `C ${cp1x} ${cp1y} ${cp2x} ${cp2y} ${points[i + 1][0]} ${
points[i + 1][1] points[i + 1][1]
packages/element/tests/bounds.test.ts
+4 -4
View File
@@ -135,9 +135,9 @@ describe("getElementBounds", () => {
} as ExcalidrawLinearElement; } as ExcalidrawLinearElement;
const [x1, y1, x2, y2] = getElementBounds(element, arrayToMap([element])); const [x1, y1, x2, y2] = getElementBounds(element, arrayToMap([element]));
expect(x1).toEqual(360.3176068760539); expect(x1).toEqual(364.8060248040008);
expect(y1).toEqual(185.90654264413516); expect(y1).toEqual(186.47330186064582);
expect(x2).toEqual(486.6924560404731); expect(x2).toEqual(494.2327553105778);
expect(y2).toEqual(320.391865303557); expect(y2).toEqual(322.3237366886165);
}); });
}); });
packages/element/tests/linearElementEditor.test.tsx
+34 -40
View File
@@ -434,12 +434,12 @@ describe("Test Linear Elements", () => {
expect(midPointsWithRoundEdge).toMatchInlineSnapshot(` expect(midPointsWithRoundEdge).toMatchInlineSnapshot(`
[ [
[ [
"53.63967", "47.30521",
"47.15774", "57.27340",
], ],
[ [
"78.65236", "83.70877",
"44.31886", "40.46424",
], ],
] ]
`); `);
@@ -499,12 +499,12 @@ describe("Test Linear Elements", () => {
expect(newMidPoints).toMatchInlineSnapshot(` expect(newMidPoints).toMatchInlineSnapshot(`
[ [
[ [
"103.63967", "97.30521",
"67.15774", "77.27340",
], ],
[ [
"128.65236", "133.70877",
"64.31886", "60.46424",
], ],
] ]
`); `);
@@ -707,14 +707,8 @@ describe("Test Linear Elements", () => {
// This is the expected midpoint for line with round edge // This is the expected midpoint for line with round edge
// hence hardcoding it so if later some bug is introduced // hence hardcoding it so if later some bug is introduced
// this will fail and we can fix it // this will fail and we can fix it
const firstSegmentMidpoint = pointFrom<GlobalPoint>( const firstSegmentMidpoint = pointFrom<GlobalPoint>(47.30521, 57.2734);
55.9697848965255, const lastSegmentMidpoint = pointFrom<GlobalPoint>(83.70877, 40.46424);
47.442326230998205,
);
const lastSegmentMidpoint = pointFrom<GlobalPoint>(
76.08587175006699,
43.294165939653226,
);
let line: ExcalidrawLinearElement; let line: ExcalidrawLinearElement;
beforeEach(() => { beforeEach(() => {
@@ -759,16 +753,16 @@ describe("Test Linear Elements", () => {
0, 0,
], ],
[ [
"85.96978", "77.30521",
"77.44233", "87.27340",
], ],
[ [
70, 70,
50, 50,
], ],
[ [
"106.08587", "113.70877",
"73.29417", "70.46424",
], ],
[ [
40, 40,
@@ -815,12 +809,12 @@ describe("Test Linear Elements", () => {
expect(newMidPoints).toMatchInlineSnapshot(` expect(newMidPoints).toMatchInlineSnapshot(`
[ [
[ [
"28.64089", "13.73276",
"21.69997", "41.73533",
], ],
[ [
"82.34322", "83.95050",
"47.57759", "40.24690",
], ],
] ]
`); `);
@@ -904,12 +898,12 @@ describe("Test Linear Elements", () => {
expect(newMidPoints).toMatchInlineSnapshot(` expect(newMidPoints).toMatchInlineSnapshot(`
[ [
[ [
"53.63967", "47.30521",
"47.15774", "57.27340",
], ],
[ [
"78.65236", "83.70877",
"44.31886", "40.46424",
], ],
] ]
`); `);
@@ -1071,8 +1065,8 @@ describe("Test Linear Elements", () => {
); );
expect(position).toMatchInlineSnapshot(` expect(position).toMatchInlineSnapshot(`
{ {
"x": "86.17305", "x": 75,
"y": "76.11251", "y": 60,
} }
`); `);
}); });
@@ -1187,12 +1181,12 @@ describe("Test Linear Elements", () => {
), ),
).toMatchInlineSnapshot(` ).toMatchInlineSnapshot(`
[ [
20, "19.99875",
20, 20,
105, 105,
80, 80,
"56.00000", "56.25357",
45, "46.47665",
] ]
`); `);
@@ -1202,7 +1196,7 @@ describe("Test Linear Elements", () => {
.toMatchInlineSnapshot(` .toMatchInlineSnapshot(`
{ {
"height": 130, "height": 130,
"width": "367.18528", "width": "367.68709",
} }
`); `);
@@ -1214,7 +1208,7 @@ describe("Test Linear Elements", () => {
), ),
).toMatchInlineSnapshot(` ).toMatchInlineSnapshot(`
{ {
"x": "272.18528", "x": "272.68709",
"y": 45, "y": 45,
} }
`); `);
@@ -1230,11 +1224,11 @@ describe("Test Linear Elements", () => {
).toMatchInlineSnapshot(` ).toMatchInlineSnapshot(`
[ [
20, 20,
35, "18.77567",
"502.18528", "502.68709",
95, "123.53753",
"208.69244", "203.94165",
"52.50000", "71.15660",
] ]
`); `);
}); });