为什么添加一个矩形然后设置其左侧和顶部会导致可选择的 'ghost' 矩形停留在旧位置？

Question

我是 Fabric.js 的新手并且非常喜欢它，但是我在尝试运行 http://fabricjs.com/fabric-intro-part-1/ 上的教程示例时遇到了奇怪的行为。代码很简单：

  var canvas = new fabric.Canvas('c');
  var rect = new fabric.Rect({left: 0, top: 0, fill: 'red', width: 50, height: 50});
  var text = new fabric.Text('click\nhere', {left: 0, top: 0, fontSize: 14});
  text.set('selectable', false);
  canvas.add(text, rect);
  rect.set({ left: 50, top: 50 });
  canvas.renderAll();

http://jsfiddle.net/r7v43b3y/2/

但是好像有一个bug：运行 fiddle，将鼠标悬停在文字上方（先不要点击），注意光标变成叉号，说明有鼠标下方的 Fabric 对象，即使它已被移动，但 Fabric 似乎并不知道这一点。现在单击文本所在的位置（不可选择）并注意您单击的是 'ghost' 对象 - 该矩形实际上位于其他位置，但单击其旧位置会在其新位置选择它。怎么回事？

Answer 1

在 rect.set({ left: 50, top: 50 }); 之后输入 rect.setCoords(); 就可以了。

为什么添加一个矩形然后设置其左侧和顶部会导致可选择的 'ghost' 矩形停留在旧位置？

Why does adding a rect then setting its left and top cause a selectable 'ghost' rect to stay in the old position?

html

javascript

fabricjs