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
объект, как в этом обновленном скрипаче