从 Fabric.js 中的 JSON 加载加载默认属性答案

【问题标题】：Load from JSON in Fabric.js loading default properties从 Fabric.js 中的 JSON 加载加载默认属性
【发布时间】：2013-10-27 00:15:49
【问题描述】：

我的画布包含带有centeredRotation:true 的对象和带有selectable:false 的其他对象当我将此画布转换为 JSON 并重新加载它时。这些对象具有它们的默认属性。即没有中心旋转和对象是可选择的。我可以知道为什么会这样吗？显然 JSON 中不包含 centeredRotation、selectable 等属性。

{"type":"rect","originX":"left","originY":"top","left":92,"top":53,"width":150,"height": 150,"fill":"#778899","stroke":null,"strokeWidth":1,"strokeDashArray":null,"strokeLineCap":"butt","strokeLineJoin":"miter","strokeMiterLimit":10 ,"scaleX":1,"scaleY":1,"angle":0,"flipX":false,"flipY":false,"不透明度":0.4,"shadow":null,"visible":true," clipTo":null,"backgroundColor":"","rx":0,"ry":0,"x":0,"y":0}],"background":""}

如何在加载对象时设置这些？

【问题讨论】：

以上json无效
我刚刚提到了对这个问题有用的json部分

标签： fabricjs

【解决方案1】：

您需要在toJSON 期间包含它们：

canvas.toJSON([ 'centeredRotation', 'selectable' ]);

参见documentation for toJSON，它描述了这个“propertiesToInclude”参数并提供了一些示例。

【讨论】：

【解决方案2】：

您也可以在创建新对象之前在主对象上指定此项。这保证了我下次从 json 加载对象时，可选择项将保存在“toObject”/“toJSON”函数中。

// Add 'selectable' to every object via the main class "Object"
fabric.Object.prototype.toObject = (function (toObject) {
    return function () {
        return fabric.util.object.extend(toObject.call(this), {
            selectable: this.selectable
        });
    };
})(fabric.Object.prototype.toObject);

我不明白为什么默认情况下它不存在，但我想这是因为它更像是一种状态而不是一种属性？

【讨论】：