javascript - fabric.js 将一个对象移动到另一个对象下面

Question

我有两层 (0,1)。 0 是 Canvas 上的底部图像，1 是顶部图像。第0层是人体模板，第1层是一些眼睛。我希望能够移动最底层(主体层)，而不移动顶层或覆盖顶层。基本上，让眼睛位于 body 上并且是可见的，但能够四处移动 body 图像。我已经能够通过以下方式实现大部分目标:

canvas.item(0).selectable = true;
canvas.item(0).evented = true;
canvas.item(1).selectable = false;
canvas.item(1).evented = false;

然而，当我开始拖动层 0(人体层)时，它将那个层带到顶部并覆盖眼睛，即使当我打印对象数组时，它仍然说 body 层是索引 0。我错过了什么？这甚至可能吗？将较低层移动到较高可见层之下？

这是我最初添加图层的方式:

    fabric.Image.fromURL(imgString, function(oImg) {

        oImg.scale(0.4);
        canvas.centerObject(oImg);
        canvas.add(oImg);

        canvas.renderAll();


    });

Answer 1

简单添加

preserveObjectStacking: true

Canvas 初始化器修复了这个问题。

var canvas = new fabric.Canvas('mainCanvas',{
        preserveObjectStacking: true
    });