FabricJS

Question

我正在尝试将一组项目添加到 canvas，但希望在添加该组时将其设置在 zorder 堆栈的底部。这是我要执行的代码：

    //Reload the SVG now
    var site_url =  "/components/<?=$designObj->svg_filename?>";
    fabric.loadSVGFromURL(site_url, function(objects, options) {
        let componentObj = fabric.util.groupSVGElements(objects, options);
        componentObj.setControlVisible(false);
        componentObj.sendToBack();   //THIS DOESNT WORK - THROWS TYPE ERROR
        componentObj.selectable = false;
        componentObj.jdeation_comp_id = "base";
        componentObj.jdeation_base_svg = "<?=$designObj->svg_filename?>";
        canvas.add(componentObj).renderAll();
    });

调用 sendToBack() 时出现以下错误：

TypeError: Cannot read property 'sendToBack' of undefined

不确定我是否完全理解这里发生的事情，似乎 sendToBack 期望类型不是组或其他类型。有更好的方法吗？

Answer 1

您不能 .sendToBack() 尚未添加到 canvas 的对象。使用 canvas.insertAt(componentObj, 0) 而不是 canvas.add(componentObj) 来指定应将对象添加到堆栈底部。

FabricJS - 在添加项目/组时设置 zorder

FabricJS - Set zorder on adding item / group