Question

使用Fabric.js

我想在画布触发mouse:over事件时捕获object:moving事件。那可能吗。似乎一次只能触发一个事件。

原因我想这样做是因为当我的形状被拖到另一个上面时，我想做“某事”。

感谢，

Answer 1

好的，所以我找到了办法。不确定它是否理想，特别是如果画布上有很多物体。

基本思路是在移动所选对象的同时找出 哪些对象位于当前鼠标位置 。

isDropZone ：添加到对象的属性（元数据），表示其是放置区。

以下是代码：

canvas.on('object:moving', function (e) {                       
        var objs = canvas.getObjects();
        var mouse = canvas.getPointer(event.e);
        for (var i = 0; i < objs.length; i++) {
            if (objs[i].containsPoint(mouse) && objs[i].isDropZone) {
                console.log("Object is in drop zone");
            }
        }               
    }
});

Answer 2

我遇到了同样的问题，我使用的是findTarget方法，它基本上可以完成你正在做的事情，但也会检查像'perPixelTargetFind＆＃39;选项。如果您正在使用组，它还将遍历组内的对象。

canvas.on('object:moving', function (event) {

   /**
    * findTarget Method that determines what object we are clicking on
    * @param {Event} e mouse event
    * @param {Boolean} skipGroup when true, group is skipped and only objects are traversed through
    */
    var hoverTarget = canvas.findTarget(event.e, false);

    console.log(hoverTarget);

})

FabricJS如何在对象：移动时捕获对象悬停

2 个答案: