FabricJS：通過光標位置查找組中的對象

Question

如何在光標位置的結構組中找到對象？

假設以下畫布初始化：

var text = new fabric.Text('Hello');
var rect = new fabric.Rect({width: 100, height: 50});
var group = new fabric.Group([text, rect], {
    left: 150, top: 100, angle: -10
});
canvas.add(group);

現在，我想檢測光標下方的對象（即文本或矩形）。 類似於以下內容：

canvas.on('mouse:move', myFunc);
myFunc = function(o) {
   var target = canvas.findTarget(o.e);
   if (target.type === 'group') {
       var obj = group.findTarget(o.e);
       // obj should be now either rect, text or null
   } 
}

但是，我找不到任何類似group.findTarget的函數。

Answer 1

我知道已經晚了。 但這可能會對其他人有所幫助。 感謝asturur，他提出了解決方案。 解

我從asturur repo下載fabricjs。 構建fabric.js文件

node build.js modules=ALL exclude=json,gestures

而且有效！

然后，您可以對組中的對象使用事件。

canvas._objects[0]._objects[0].on('mousedown', function(e){ this.stroke = 'black'});

在我的應用中，我決定從mousedown回調中搜索事件

group.on('mousedown', function(e){
    var innerTarget  = group._searchPossibleTargets(e.e);
    console.log(innerTarget);
});

group._searchPossibleTargets = function(e) {
    var pointer = this.canvas.getPointer(e, true);
    var i = objects.length,
        normalizedPointer = this.canvas._normalizePointer(this, pointer);

    while (i--) {
        if (this.canvas._checkTarget(normalizedPointer, this._objects[i])) {
            return this._objects[i];
        }
    }
    return null;
}