javascript - PaperJS 获取形状的坐标（圆形、矩形等）

Question

我使用 paperJS 创建了一个简单的图像标记。现在我必须添加一个撤消选项，以创建我需要存储所有坐标位置和一个要撤消的按钮。我怎么能这样做任何人都可以帮助我。这是我的脚本。

function onMouseDrag(event) {
            if(set == 1){
                    path = new Path.Circle({
                        center: event.point,
                        radius: (event.downPoint - event.point).length,
                        fillColor: null,
                        strokeColor: '#e9e9ff',
                        strokeWidth: 1
                    });
            }else if(set == 2){
                var rectangle = new Rectangle(event.point, event.downPoint);
                var path = new Path.Rectangle(rectangle);
                path.fillColor = null;
                path.strokeColor = '#e9e9ff';
                path.strokeWidth = 1;   
            }else if(set == 3){
                var path = new Path.Line({
                        from: event.point,
                        to : event.downPoint,
                        strokeColor: 'black'
                    });
            }else if(set == 4){
                        var path = new PointText({
                        point: event.point,
                        content: 'The contents of the point text',
                        fillColor: 'black',
                        fontSize: 25
                    }); 
            }
                  path.removeOnDrag();
        };

        function onMouseUp(event) {
                circles.push(path);
        };

这是我的html。

<div class="menu-list">
    <input type="button" value="Circle" onClick="return set=1;">
    <input type="button" value="Rectangle" onClick="return set=2;">
    <input type="button" value="Line" onClick="return set=3;">
    <input type="button" value="Text" onClick="return set=4;">
</div>
<div class="img-mark">
    <canvas id="canvas" resize></canvas>
</div>
<div class="mark-list">

</div>

Answer 1

我不太确定，如果我理解你想要什么，但试试这个：你可以在 hitResult 的帮助下选择一个特定的路径或形状：

var hitResult = project.hitTest(event.point, hitOptions);
if (!hitResult) {
    return;
} else {
    path = hitResult.item;
}

看到这个例子：http://paperjs.org/examples/hit-testing/
然后你可以在用户点击删除时调用path.remove()（http://paperjs.org/reference/path ）

PS：而不是使用set == x你应该看看http://paperjs.org/reference/tool。您可以使用 and 定义不同的工具，circleTool = new Tool();而不是调用circleTool.activate()andcircleTool.onMouseDown = function() {...}