`Path` appears like polylines while animating to new values

[sayuriu]

Describe the bug
During morph transitions (<Path>.data(newPath)), all curves between points are turned into lines.
This effect is present on the final render as well.

project._.Motion.Canvas.-.Google.Chrome.2024-03-05.17-50-48-c.mp4

To Reproduce

import { Node, Path, makeScene2D } from '@motion-canvas/2d';
import { createRef, waitFor } from '@motion-canvas/core';

const FLOWER_DEFAULT = "M39.3043,4.58359c0,0,7.542,4.436,8.886,10.399c1.291,5.723,0,9.891,0,9.891c0,0,6.146,-3.743,11.519,-3.743c4.163,0,9.87,2.717,9.87,2.717c0,0,-4.028,6.732,-5.707,8.747c-2.696,3.235,-10.028,4.838,-10.028,4.838c0,0,7.734,0.488,11.125,5.344c3.73,5.342,5.953,14.798,5.953,14.798c0,0,-11.619,1.433,-17.078,-1.952c-4.137,-2.565,-5.654,-6.071,-5.654,-6.071c0,0,1.717,8.173,0,14.252c-1.843,6.528,-8.464,12.467,-8.464,12.467c0,0,-6.08,-7.134,-7.813,-12.467c-1.732,-5.332,1.26,-14.252,1.26,-14.252c0,0,-1.01,2.29,-5.434,6.071c-3.899,3.332,-15.183,4.186,-15.183,4.186c0,0,0.166,-11.547,3.242,-15.723c3.151,-4.275,11.941,-6.653,11.941,-6.653c0,0,-4.025,0.696,-9.71,-2.02c-5.473,-2.615,-8.951,-10.539,-8.951,-10.539c0,0,4.562,-3.743,11.948,-3.743c6.134,0,10.887,4.555,10.887,4.555c0,0,-0.459,-6.152,1.26,-11.548c1.409,-4.424,6.131,-9.554,6.131,-9.554z";
const FLOWER_2 = "M29.6022,8.18729c0,0,10.261,-2.839,14.282,2.61c3.483,4.72,3.604,8.967,3.604,8.967c0,0,6.221,-2.733,11.519,-1.84c3.556,0.599,4.553,3.399,4.553,3.399c0,0,3.932,0.325,2.705,2.585c-2.302,3.718,-8.385,10.113,-8.385,10.113c0,0,6.69,1.176,10.08,6.032c3.731,5.342,0.916,12.413,0.916,12.413c0,0,-4.41,-1.092,-9.869,-4.477c-4.137,-2.565,-7.959,-3.546,-7.959,-3.546c0,0,3.81,8.82,2.093,14.9c-1.843,6.528,-9.257,14.571,-9.257,14.571c0,0,-5.431,-7.45,-7.163,-12.783c-1.732,-5.332,-1.038,-15.385,-1.038,-15.385c0,0,-3.551,5.685,-7.975,9.465c-3.899,3.332,-12.874,4.132,-12.874,4.132c0,0,-2.174,-10.19,0,-14.9c2.174,-4.71,9.078,-9.219,9.078,-9.219c0,0,-2.101,-0.495,-6.585,-4.92c-4.548,-4.488,-6.431,-1.796,-6.431,-1.796c0,0,-1.453,-6.344,5.532,-8.744c5.444,-1.871,14.783,0.813,14.783,0.813c0,0,0.529,-4.142,0,-9.78c-0.319,-3.406,-1.609,-2.61,-1.609,-2.61z";

export default makeScene2D(function* (view) {
  view.fill("#000")
  const flowerRef = createRef<Path>();
  view.add(<Node cache scale={[624 / 80, 624 / 80]}>
    <Path
      position={[-39, -39]}
      ref={flowerRef}
      compositeOperation={"source-out"}
      data={FLOWER_DEFAULT}
      fill={"#FFD700"}
    />
  </Node>)

  yield* waitFor(0.5);
  yield* flowerRef().data(FLOWER_2, 2);
  yield* waitFor(1);
});

Expected behavior
Curves are preserved during transitions.
(The video below uses browser CSS keyframes)

Document.-.Google.Chrome.2024-03-05.17-42-13-c.mp4

Console errors
None

Package versions:

• core: 3.14.1
• two: 3.14.2
• ui: 3.14.2
• vitePlugin: 3.14.1

Additional context
Maybe it has something to do with interpolation resolutions / amount of division segments when calculating new curves?

[sayuriu]

Solved: Lowering precision in path interpolation functions worked (thanks to @aarthificial)
Can we somehow expose this parameter?
Also the parameter name seems a bit "misleading" - something like distance may better fit the role of the parameter, I think.