选择后，Fabric.js对象会跳到右下角-我该如何防止呢？

Question

我有一个fabric.js画布，可以在其中移动对象。 有时，对象会突然跳到右下角。 看起来像这样：

似乎正在发生的事情是创建了一个使用对象的顶部和左侧坐标的组。 但是，组内的对象还会添加相对于组的顶部和左侧坐标。 因此，对象的顶部和左侧坐标是其应有的两倍。

这并非始终如一。 通常在我快速单击时发生，但有时在拖动时发生。 在大多数情况下，它应该正常工作。

我想知道为什么会这样，更重要的是，如何预防它。

我应该注意，更新画布时发生了很多事情-比我可以简单粘贴到此处的方式要多得多。 重写层，绘制图像，更新UI。 我猜测某些内容加载的顺序不正确，但是我不确定是什么。

Answer 1

我想到了。

在渲染画布时，我一直在清除选定的对象，我需要这样做以保持渲染一致。 我稍后会恢复选择：

canvas.on('object:modified',function(){
  var active_objects = canvas.getActiveObjects();
  canvas.discardActiveObject();

  // rendering code

  var sel = new fabric.ActiveSelection(active_objects,{
     canvas: canvas,
  });
  sel.setObjectsCoords();
  sel.setCoords();
  canvas.setActiveObject(sel);
  canvas.requestRenderAll(); 
});

问题是，如果在调用canvas.setActiveObject（sel）之前创建了一个新选择，则新选择将变得混乱，对象将移至右下角。

使用简单的if语句修复：

if (canvas.getActiveObjects().length < 1){
   var sel = new fabric.ActiveSelection(active_objects,{
      canvas: canvas,
   });
   sel.setObjectsCoords();
   sel.setCoords();
   canvas.setActiveObject(sel);
   canvas.requestRenderAll();
}

这可能是特定于我的项目的。