我试图通过单击并拖动对象来移动画布中的项目。我正在使用paperjs
。这是我的代码:
我按如下所示绘制矩形:
var rect = new paper.Path.Rectangle(new paper.Point(100, 100), new paper.Point(200, 250));
rect.strokeColor = 'black';
rect.fillColor = 'red';
rect.strokeWidth = 5;
要移动矩形,我要创建一个Tool
并为其附加事件。
onSelectShape(){
const self = this;
const hitOptions = {
segments: true,
stroke: true,
fill: true,
tolerance: 5
};
const toolSelect = new paper.Tool();
toolSelect.activate();
let segment, path;
toolSelect.onMouseDown = function(event) {
const hitResult = self.project.hitTest(event.point, hitOptions);
console.log(hitResult);
if (!hitResult){
return;
}
if (hitResult) {
path = hitResult.item;
}
};
toolSelect.onMouseMove = function(event) {
self.project.activeLayer.selected = false;
if(event.item){
event.item.selected = true;
}
};
toolSelect.onMouseDrag = function(event) {
if (path) {
path.position += event.delta;
}
};
}
这是完整的Stackblitz链接。我不确定为什么它不起作用。任何帮助将不胜感激
答案 0 :(得分:0)
第31行更改
const self = this;
到
const self = paper.project;
第69行更改
path.position += event.delta;
到
path.position = path.position.add(event.delta);