1

キャンバスにオブジェクト (オブジェクトのグループ) を読み込もうとしていますが、問題はありません。しかし、ロードされたオブジェクト (scaleX、scaleY、lockScalingX など) に set メソッドを使用していくつかのオプションを追加したい場合、「Uncaught TypeError: Object Group has no method 'set'」というエラーが発生します。理由がわかりません。いくつかの方法を試しました。私のコードは以下です -

var json = {
"objects": [{
    "type": "group",
        "originX": "center",
        "originY": "center",
        "left": 268,
        "top": 203,
        "width": 428,
        "height": 274,
        "fill": "rgb(0,0,0)",
        "overlayFill": null,
        "stroke": null,
        "strokeWidth": 1,
        "strokeDashArray": null,
        "scaleX": 1,
        "scaleY": 1,
        "angle": 0,
        "flipX": false,
        "flipY": false,
        "opacity": 1,
        "selectable": true,
        "hasControls": true,
        "hasBorders": true,
        "hasRotatingPoint": true,
        "transparentCorners": true,
        "perPixelTargetFind": false,
        "shadow": null,
        "visible": true,
        "objects": [{
        "type": "rect",
            "originX": "center",
            "originY": "center",
            "left": 11,
            "top": 37,
            "width": 200,
            "height": 200,
            "fill": "rgba(179,179,179,0.5)",
            "overlayFill": null,
            "stroke": "#FF0000",
            "strokeWidth": 0.1,
            "strokeDashArray": null,
            "scaleX": 1,
            "scaleY": 1,
            "angle": 0,
            "flipX": false,
            "flipY": false,
            "opacity": 1,
            "selectable": true,
            "hasControls": false,
            "hasBorders": true,
            "hasRotatingPoint": true,
            "transparentCorners": true,
            "perPixelTargetFind": false,
            "shadow": null,
            "visible": true,
            "rx": 0,
            "ry": 0
    }, {
        "type": "triangle",
            "originX": "center",
            "originY": "center",
            "left": 114,
            "top": -37,
            "width": 200,
            "height": 200,
            "fill": "rgba(179,179,179,0.5)",
            "overlayFill": null,
            "stroke": "#FF0000",
            "strokeWidth": 0.1,
            "strokeDashArray": null,
            "scaleX": 1,
            "scaleY": 1,
            "angle": 0,
            "flipX": false,
            "flipY": false,
            "opacity": 1,
            "selectable": true,
            "hasControls": false,
            "hasBorders": true,
            "hasRotatingPoint": true,
            "transparentCorners": true,
            "perPixelTargetFind": false,
            "shadow": null,
            "visible": true
    }, {
        "type": "circle",
            "originX": "center",
            "originY": "center",
            "left": -114,
            "top": 29,
            "width": 200,
            "height": 200,
            "fill": "rgba(179,179,179,0.5)",
            "overlayFill": null,
            "stroke": "#FF0000",
            "strokeWidth": 0.1,
            "strokeDashArray": null,
            "scaleX": 1,
            "scaleY": 1,
            "angle": 0,
            "flipX": false,
            "flipY": false,
            "opacity": 1,
            "selectable": true,
            "hasControls": false,
            "hasBorders": true,
            "hasRotatingPoint": true,
            "transparentCorners": true,
            "perPixelTarge,,tFind": false,
            "shadow": null,
            "visible": true,
            "radius": 100
    }]
}],
    "background": ""
},
objects = json.objects,
canvas = new fabric.Canvas('canvas');

for (var i = 0; i < objects.length; i++) {
var type = fabric.util.string.camelize(fabric.util.string.capitalize(objects[i].type));
type.set({
    scaleX: 1.2,
    scaleY: 1.2,
    lockScalingX: true,
    lockScalingY: true
});
type.setCoords();

if (fabric[type].async) {
    fabric[type].fromObject(objects[i], function (img) {
        canvas.add(img);
    });
} else {
    canvas.add(fabric[type].fromObject(objects[i]));
}
}

誰でも私を助けてくれますか？

4

1 に答える 1