FabricJS:对象:当用户选择多个对象时不会触发移动事件

Ton*_*nyE 2 javascript selection drag fabricjs

在 FabricJS 中,有一个 object:moving 事件,您可以为其触发一个函数,我已经对其进行了配置,以将线条附加到点上,就像在 Stickman 演示中一样:http ://fabricjs.com/stickman/

在他们的演示中,他们关闭了通过单击并拖动点周围的正方形来选择点的功能,然后通过单击并拖动它来移动所选对象。就我而言,我希望用户能够选择多个点并同时拖动它们,但现在发生的情况是线条与点断开。这个确切的问题在他们的二次曲线示例中得到了说明: http: //fabricjs.com/quadratic-curve/。一次选择两个点并拖动您的选择...它将断开点与线的连接。

移动选择时是否有某种方法可以确定事件?它似乎动态创建一个组,但我尝试使用选择:创建事件来获取该组,并再次在组中的每个对象上设置一个对象:移动事件处理程序,但没有成功。这里有什么想法吗?

小智 5

您可以采取两种方法。

  1. 向画布添加“object:moving”事件的侦听器。这将对任何移动的物体或团体触发。 canvas1.on('object:moving', function(event) { console.log("object:moving"); });

  2. 创建选择组后,您可以将移动事件直接添加到该组中。

    canvas1.on('selection:created', function(event) { canvas1.getActiveGroup().on('moving', function(event) { console.log('moving'); }); console.log("selection created"); });

这个小提琴有两者的例子。 http://jsfiddle.net/pxnfbt89/