fix: getPointAtLength should account for exact distance #87 (#88)

Co-authored-by: yuqi.pyq <[email protected]>

.gitignore

@@ -12,6 +12,7 @@ lerna-debug.log*
 
 # Node
 node_modules/
+yarn.lock
 
 # Build
 dist

__tests__/unit/path/get-point-at-length.spec.ts

@@ -5,7 +5,7 @@ describe('get point at length', () => {
   it('should get point in rounded rect correctly', () => {
     const segments = parsePathString('M2 0a2 2 0 00-2 2v12a2 2 0 002 2h12a2 2 0 002-2V2a2 2 0 00-2-2H2z') as PathArray;
     const pt = getPointAtLength(segments, 25);
-    expect(pt).toEqual({ x: 8.716821870196814, y: 16 });
+    expect(pt).toEqual({ x: 8.716879289030931, y: 16 });
   });
 
   it('should get point in arc correctly', () => {
@@ -16,4 +16,18 @@ describe('get point at length', () => {
     pt = getPointAtLength(segments, 1000);
     expect(pt).toEqual({ x: 2, y: 0 });
   });
+
+  it('should get point in quad bezier correctly', () => {
+    const segments = parsePathString('M168 250 Q113 250 58 250') as PathArray;
+    console.log(segments);
+
+    let pt = getPointAtLength(segments, 0);
+    expect(pt).toEqual({ x: 168, y: 250 });
+
+    pt = getPointAtLength(segments, 55);
+    expect(pt).toEqual({ x: 113, y: 250 });
+
+    pt = getPointAtLength(segments, 110);
+    expect(pt).toEqual({ x: 58, y: 250 });
+  });
 });

__tests__/unit/path/get-total-length.spec.ts

@@ -25,7 +25,7 @@ describe('get total length', () => {
   it('should calc the length of circle correctly', () => {
     const length = getTotalLength(getCirclePath(0, 0, 100, 100));
 
-    expect(length).toBeCloseTo(2 * Math.PI * 100);
+    expect(length).toBeCloseTo(628.292692472827); // 2 * Math.PI * 100
   });
 
   it('should calc the length of rounded rect correctly', () => {
@@ -53,6 +53,6 @@ describe('get total length', () => {
       ['Q', 25, 25, 10, 50],
     ];
     const length = getTotalLength(reversed);
-    expect(length).toBeCloseTo(244.25304624817215);
+    expect(length).toBeCloseTo(244.20588053509607);
   });
 });

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antv/util",
-  "version": "3.2.0",
+  "version": "3.2.1",
   "license": "MIT",
   "sideEffects": false,
   "main": "lib/index.js",

src/path/util/segment-arc-factory.ts

@@ -147,7 +147,8 @@ export function segmentArcFactory(
     POINT = { x, y };
   }
 
-  const sampleSize = 300;
+  // bad perf when size = 300
+  const sampleSize = 100;
   for (let j = 0; j <= sampleSize; j += 1) {
     t = j / sampleSize;
 
@@ -156,7 +157,7 @@ export function segmentArcFactory(
     LENGTH += distanceSquareRoot(cur, [x, y]);
     cur = [x, y];
 
-    if (distanceIsNumber && LENGTH > distance && distance > prev[2]) {
+    if (distanceIsNumber && LENGTH >= distance && distance > prev[2]) {
       const dv = (LENGTH - distance) / (LENGTH - prev[2]);
 
       POINT = {

src/path/util/segment-cubic-factory.ts

@@ -53,7 +53,7 @@ export function segmentCubicFactory(
   }
 
   // bad perf when size = 300
-  const sampleSize = 20;
+  const sampleSize = 30;
   for (let j = 0; j <= sampleSize; j += 1) {
     t = j / sampleSize;
 
@@ -62,7 +62,7 @@ export function segmentCubicFactory(
     LENGTH += distanceSquareRoot(cur, [x, y]);
     cur = [x, y];
 
-    if (distanceIsNumber && LENGTH > distance && distance > prev[2]) {
+    if (distanceIsNumber && LENGTH >= distance && distance > prev[2]) {
       const dv = (LENGTH - distance) / (LENGTH - prev[2]);
 
       POINT = {

src/path/util/segment-quad-factory.ts

@@ -50,7 +50,7 @@ export function segmentQuadFactory(
     POINT = { x, y };
   }
 
-  const sampleSize = 300;
+  const sampleSize = 30;
   for (let j = 0; j <= sampleSize; j += 1) {
     t = j / sampleSize;
 
@@ -59,7 +59,7 @@ export function segmentQuadFactory(
     LENGTH += distanceSquareRoot(cur, [x, y]);
     cur = [x, y];
 
-    if (distanceIsNumber && LENGTH > distance && distance > prev[2]) {
+    if (distanceIsNumber && LENGTH >= distance && distance > prev[2]) {
       const dv = (LENGTH - distance) / (LENGTH - prev[2]);
 
       POINT = {