Question

我的画布中有几条路径，我正在尝试绘制在特定位置放在画布上的图像，并且我想根据图像被放置的区域剪切图像，我有位置，但是有更多的对象一个在另一个之下，但我只想要那个最顶层的对象..是否有任何内置的方法可以帮助我实现这个目标？

任何帮助将不胜感激，提前致谢。

Answer 1

默认情况下，

var objects = canvas.getObjects();
var top = objects[objects.length - 1];

for (var i = objects.length - 1; i >= 0; --i) {
    if (objects[i].left === 100 && objects[i].top === 100) {
        top = objects[i];
        break;
    }
}

我不知道任何内置方法，你检查canvas._objects属性，它将所有对象存储在画布中。

Answer 2

var objs = canvas.getObjects();
var topmost = new Object(); 

   jQuery.each(objs,function(index,val){

        if( val.containsPoint(position) && !(editor.isTargetTransparent(val, canvasX, canvasY)) ){
            //alert("here -->"+val.type);
             // alert(val.get("clipFor"));
            topmost = val;
        }


   });
if(topmost != undefined){
//code here
}

Answer 3

在Farbic js画布鼠标事件上

function mouseEvent(e) {
    console.log(e.target);
}

canvas.on({
    "mouse:up": mouseEvent,
    "mouse:down": mouseEvent
}

target参数中的e始终是最上面的对象，该方法也可以在rotated对象上使用，只需确保对象坐标正确，就可以使用{ object.setCoords()事件中的{1}}，以确保其正确。

http://fabricjs.com/events是检查事件的示例

Fabric js找到一个点上最顶层的对象？

3 个答案: