Переместить уже созданный прямоугольник на холсте - PullRequest
Новая
       49

Переместить уже созданный прямоугольник на холсте

0 голосов
/ 09 сентября 2018

Я пытаюсь переместить элемент на холсте, перетаскивая объект. Я использую 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 . Я не уверен, почему это не работает. Любая помощь будет высоко ценится

1 Ответ

0 голосов
/ 18 сентября 2018

строка 31, изменение 

const self = this;

до 

const self = paper.project;

строка 69, изменение 

path.position += event.delta;

до 

path.position = path.position.add(event.delta);
...