我有FabricJS loadFromJSON方法的问题 . 在“实时”画布上,一切都很好用,但是当我重新加载内部的画布对象时,它们正在丢失裁剪 .

我在这里介绍过 . 请单击“重新加载数据”按钮 . 重新加载画布后应该看起来与单击“重新加载数据”按钮之前完全相同,但图像出现在剪切路径之外 .

https://jsbin.com/rowihelome/1/edit?html,js,output

在这个例子中,我创建了一个由圆形路径剪裁的图像 . 还有其他形状,不应与任何其他物体相互作用 .

我有可能添加多个由形状剪裁的图像,这些图像独立于任何其他形状:

imageObject.clipTo = function (ctx) {
            ctx.save();
            let newObj = [];
            canvas.getObjects().forEach(function (o) {
                if (o.get('id') === 'shape-image' || o.get('id') === 'shape-for-image') {
                    newObj.push(o);
                }
            });
            ctx.setTransform(1, 0, 0, 1, 0, 0);
            newObj[newObj.indexOf(this) - 1].render(ctx);
            ctx.restore();
        };

我的问题是如何在画布上保存对象的当前状态?我的裁剪方法有点不对,FabricJS无法将其加载到json中吗?