javascript - 使用 Paper.js 在贝塞尔曲线中插入新点的理想 handle 位置

Question

我在 paper.js 中构建了一个工具，允许插入新的控制点，效果很好，我遇到的问题是，我还必须计算每个新控制点的 handle 位置(除非我我遗漏了一些东西，纸张似乎并没有为你做到这一点)，事实证明这是一项艰巨的任务。下面的代码是我目前正在工作的代码，该点已成功添加 handle ，但它使曲线变形。我想以曲线不变形的方式添加 handle 。

gEditor.MoveTool.onMouseDown = function (event) {
    gEditor.HitResult = paper.project.hitTest(event.point, gEditor.HitOptions);

    var location = gEditor.HitResult.location;
    var newPoint = gEditor.HitResult.item.insert(location.index + 1, event.point);
    var prevSegment, nextSegment;

    if (location.index - 1 >= 0){
        prevSegment = gEditor.HitResult.item.segments[location.index - 1];
    }

    if (location.index + 2 < gEditor.HitResult.item.length) {
        nextSegment = gEditor.HitResult.item.segments[location.index + 2];
    }

    if (prevSegment && nextSegment) {
        newPoint.handleIn = {
            x: prevSegment.point.x - ((prevSegment.point.x + newPoint.point.x) / 2),
            y: prevSegment.point.y - ((prevSegment.point.y + newPoint.point.y) / 2),
        };

        newPoint.handleOut = {
            x: nextSegment.point.x - ((nextSegment.point.x + newPoint.point.x) / 2),
            y: nextSegment.point.y - ((nextSegment.point.y + newPoint.point.y) / 2),
        };
    }
}

我看过 de Cateljau 的算法，并假设我需要的是某种形式的算法，但我不知道如何实现它，因为我看到的每个例子基本上都绘制了曲线，而不是查找 handle 的 X、Y 位置。

Answer 1

是的，paper.js 已经有了这个函数:curve.divide()。完成 HitTest 后:

path = HitResult.item;
if (HitResult.type == 'stroke') {
   var location = HitResult.location;
   path.curves[location.index].divide(location);
}