Question

我已经集成了Fabric Js，它的工作正常，但是我有一个查询，当我添加多个图像时，我无法将一个图像拖到另一个上，最后添加的图像保持在顶部，它们的位置可以改变吗？我找到了一个工作正常的小提琴但它没有图像和动态生成的元素条。

var canvas = window.__canvas = new fabric.Element('drawing_area');

        $(".vb_image li a img, .vb_frame_slider, .vb_quote_slider, .vb_graphic_slider").click(function(e){

           var target = e.target || e.srcElement; 

            fabric.Image.fromURL(target.src, function(oImg) {
                canvas.add(oImg);
                oImg.scaleToWidth(200);
                canvas.centerObjectH(oImg).centerObjectV(oImg);
                oImg.setCoords();
                canvas.renderAll();


              });
        });

这是我发现的一些工作小提琴，但我不能在图像上实现这个东西。 http://jsfiddle.net/RRv3g/3/

Answer 1

如果您希望拖动的图片位于其他图片之上，则可以使用image.moveTo(index)或更多image.bringToFront()。

fabric.Image.fromURL(imageUrl, function(image) {
    image.on('selected', function() {
        image.bringToFront();
    });
    canvas.add(image);
    canvas.renderAll();
});

工作示例http://jsfiddle.net/px52snx4/

Fabric Js将一个图像拖到另一个图像上

1 个答案: