FabricJS: object:moving event doesn't fire when user selects multiple objects

梦想与她 提交于 2019-12-11 05:21:27

问题


In FabricJS, there is an object:moving event you can fire a function for, which I have rigged up to keep lines attached to dots in the same way they have here in the stickman demo: http://fabricjs.com/stickman/

In their demo, they have turned of the ability to select dots by clicking and dragging a square around them, then moving that selection of objects by clicking and dragging it. In my case, I want the user to be able to select multiple dots and drag them at the same time, but right now what's happening is that the lines disconnect from the dots. This exact issue is illustrated here in their quadratic curve example: http://fabricjs.com/quadratic-curve/. Select both dots at once and drag your selection... it will disconnect the dots from the line.

Is there some way to fig up an event when moving the selection? It seems to create a group on the fly, but I tried using the selection:created event to get a hold of that group and again set an object:moving event handler on each object in the group, with no success. Any ideas here?


回答1:


There are two approaches you can take.

  1. Add a listener to the canvas for 'object:moving' event. This will fire for any moving object or group. canvas1.on('object:moving', function(event) { console.log("object:moving"); });

  2. When a selection group is created you can add a moving event directly to the group.

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

This fiddles has examples of both. http://jsfiddle.net/pxnfbt89/



来源:https://stackoverflow.com/questions/27159041/fabricjs-objectmoving-event-doesnt-fire-when-user-selects-multiple-objects

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!