是否可以同时在 FabricJS 画布上独立拖放多个对象？

Posted 2023-03-05

【中文标题】是否可以同时在 FabricJS 画布上独立拖放多个对象？

【英文标题】：Is it possible to independently drag & drop multiple objects on a FabricJS canvas at the same time?

【发布时间】：2014-02-16 18:42:58

【问题描述】：

我正在开发带有Fabric.js 的基于触摸的应用程序。开箱即用，拖放支持非常出色。不幸的是，您一次只能拖动一个对象 - 画布的其余部分基本上是“锁定”的，直到当前对象的拖动结束。

是否可以一次同时拖动多个对象？怎么可能实现？我的用例是这样的：想象一个有多个拼图的画布，你可以触摸/拖动。我希望能够同时独立触摸和拖动至少 2 块（每块用不同的手指）。

我正在使用标准的拖动事件处理程序。我没有看到任何明显的方法来实现这一点。

canvas.on('object:moving', function (e)  ... );

【问题讨论】：

你有没有想过在github上问作者，或者提出功能请求？我未受过教育的猜测是，这在技术上是可行的，但尚未在 Fabric 中实现。

几天前我在作者那里发了推文。不过，通过 github 是一个很好的建议。

@KurtSchindler 是的，应该可以通过手势模块实现，但 IIRC 可能需要一些调整（与单点触控手势不同，开箱即用无法使用）

在fabric.js @kangax 中实现这个的任何可能性？

【参考方案1】：

您可以对对象进行分组。

var mygroup = new fabric.Group([ obj1, obj2, obj3 ],  left: 200, top: 200 );
canvas.add(group);

您可以预先分组您的对象或让用户选择要分组的对象。一个组可以一起拖动。

此方法在 1.3.12 版本之后有效

【讨论】：

我知道这一点，但这不是我想要完成的。我试图在触摸屏上使用 >=2 个手指一次独立地在不同方向上移动 >=2 个对象。分组将根据位置将它们全部沿同一方向移动。

您可以将此添加到您的问题中吗？触摸屏不是首先想到的:)