FabricJS: как получить позиции обновленного пути

Я создавал некоторые визуальные элементы, используя Fabric js. В моем проекте пути обновлялись. Но проблема в том, что измерения пути оказались не такими, как ожидалось.

Ссылка на jsFiddle

var canvas = new fabric.Canvas('c', {width: 400, height: 400});

var line = new fabric.Path('M,50,50,L,50,150,150,150,150,50,Z', {            
    fill: 'blue'

});

line.setCoords();

// During update
line.initialize('M,150,50,L,150,150,300,150,300,50,Z')
line.setCoords();
canvas.renderAll();

В этом примере путь был первоначально нарисован на расстоянии 50 пикселей от левой границы холста. Затем я изменил команду path, чтобы она двигалась на 100px вправо.

Но после обновления пути фигура фактически располагается на расстоянии 175 пикселей от левой стороны. Кроме того, свойство left элемента path не изменяется.

Кроме того, не в состоянии получить представление обо всех этих свойствах и их отношениях, таких как, слева, сверху, scaleX, scaleY, высоте, ширине, pathOffset, oCoords, originalState и т. Д. В различных условиях, таких как путь / холст масштабируется, поворачивается, перемещается, помещается внутри группы и т. д.

1 ответ

Я не уверен, что вы пытаетесь достичь, но initialize Метод не является методом обновления, но это конструктор класса, вы практически переопределяете путь исходного объекта.

Если вы просто пытаетесь передвигаться по своему первоначальному пути, вы должны поиграть с ним. left, top свойства Path объект, как в этом обновленном скрипаче

Другие вопросы по тегам