Javascript 使用paperJS绘制多个圆

如何使用paperjs绘制多个圆？我尝试删除

path.removeOnDrag（）

它在删除

fillcolor

后工作，但输出不符合预期

<script type="text/paperscript" canvas="canvas">
        function onMouseDrag(event) {
            // The radius is the distance between the position
            // where the user clicked and the current position
            // of the mouse.
            var path = new Path.Circle({
                center: event.downPoint,
                radius: (event.downPoint - event.point).length,
                fillColor: null,
                strokeColor: 'black',
                strokeWidth: 10
            });

            // Remove this path on the next drag event:
            path.removeOnDrag();
        };
</script>

函数onMouseDrag（事件）{
//半径是位置之间的距离
//用户单击的位置和当前位置
//老鼠的名字。
var path=新路径。圆({
中心：event.downPoint，
半径：（event.downPoint-event.point）。长度，
fillColor:null，
strokeColor:'黑色'，
冲程宽度：10
});
//在下一个拖动事件中删除此路径：
path.removeOnDrag（）；
};

这里有一个简单的解决方案：

因此，在mouseUp上，您只需将当前绘制的路径存储到数组中。然后，如果需要，也可以稍后访问和操作这些环

// path we are currently drawing
var path = null;

// array to store paths (so paper.js would still draw them)
var circles = [];
function onMouseDrag(event) {
    // The radius is the distance between the position
    // where the user clicked and the current position
    // of the mouse.
    path = new Path.Circle({
        center: event.downPoint,
        radius: (event.downPoint - event.point).length,
        fillColor: null,
        strokeColor: 'black',
        strokeWidth: 10
    });

    // Remove this path on the next drag event:
    path.removeOnDrag();

};

function onMouseUp(event) {
    // if mouseUp event fires, save current path into the array
    circles.push(path);
};

---

如果你描述一下你的期望，这会有所帮助。代码确实执行了它应该执行的操作，那么您感觉到的问题是什么？另外，一个jsfiddle.net示例也会有所帮助；在这种情况下，如图所示，我得到了输出。如何在不隐藏第一个圆的情况下绘制另一个圆。谢谢您的工作。是否有IE8的替代解决方案。否。PaperJS不支持IE 8。请在此处阅读更多信息：