Fabric.js - объекты не обновляют кэшированную позицию? - PullRequest
Новая
       25

Fabric.js - объекты не обновляют кэшированную позицию?

0 голосов
/ 04 июля 2018

Трудно написать этот заголовок, поскольку я не совсем уверен, в чем здесь проблема, но я предполагаю, что это связано с тем, как Fabric.js кэширует свойства объекта.

Скажем, я создаю прямоугольник: 

let foo = new fabric.Rect({
    left: 10,
    top: 10,
    height: 50,
    width: 50,
    fill: 'green'
});
canvas.add(foo);
canvas.renderAll();

И я хочу изменить его заливку при наведении: 

canvas.on('mouse:hover', evt => {
    if (!evt.target) return;
    evt.target.set('fill', 'green');
});

Все отлично работает.

Однако, если я программно изменю положение или размер объекта: 

foo.set({left: 500});
canvas.renderAll();

... событие запускается, только если я наведите курсор мыши на его OLD позицию, то есть пространство между tl = 10,10 / tr = 60,10 / br = 60,60 / bl = 10, 60, если я не наведу новую позицию в точке tl = 500,10 / tr = 560,10 / br = 560,60 / bl = 510,60.

enter image description here

Так что кеш не обновляется. Это происходит несмотря на вызов .renderAll() после каждого такого изменения.

Что я делаю не так?

1 Ответ

0 голосов
/ 04 июля 2018

Согласно документу, который я нашел здесь , похоже, set просто перемещает его изображение.

Если вы хотите обновить зону запуска событий, вам также нужно позвонить setCoords.

Кажется, это работает нормально: 

foo.set({left: 500});
foo.setCoords();
canvas.renderAll();
...