Fabri c JS загрузка из JSON ОШИБКА Невозможно прочитать свойство fromObject из undefined

Question

• 1000 'fromObject' из неопределенного

Ссылка на скрипт

https://jsfiddle.net/vishal198721/m6c2knj3/3/

<div class="lumise"> <canvas id="plus"></canvas> </div>
    var canvas_id = jQuery('.lumise canvas').attr('id');
        

        fabric.Object.prototype.set({
            transparentCorners: false,
            cornerColor: 'rgba(102,153,255,0.5)',
            cornerSize: 12,
            padding: 5
        });
        
        // initialize fabric canvas and assign to global windows object for debug
        var canvas = window._canvas = new fabric.Canvas(canvas_id);
        var json = '{\"objects\":[{\"type\":\"rect\",\"originX\":\"left\",\"originY\":\"top\",\"left\":-1.5,\"top\":-12.88,\"width\":600,\"height\":600,\"fill\":\"transparent\",\"stroke\":null,\"strokeWidth\":1,\"strokeDashArray\":null,\"strokeLineCap\":\"butt\",\"strokeLineJoin\":\"miter\",\"strokeMiterLimit\":10,\"scaleX\":1,\"scaleY\":1,\"angle\":0,\"flipX\":false,\"flipY\":false,\"opacity\":1,\"shadow\":null,\"visible\":true,\"clipTo\":null,\"backgroundColor\":\"\",\"fillRule\":\"nonzero\",\"globalCompositeOperation\":\"source-over\",\"transformMatrix\":null,\"skewX\":0,\"skewY\":0,\"rx\":0,\"ry\":0},{\"type\":\"image\",\"originX\":\"center\",\"originY\":\"center\",\"left\":300,\"top\":280,\"width\":100,\"height\":100,\"fill\":\"rgb(0,0,0)\",\"stroke\":null,\"strokeWidth\":0,\"strokeDashArray\":null,\"strokeLineCap\":\"butt\",\"strokeLineJoin\":\"miter\",\"strokeMiterLimit\":10,\"scaleX\":1,\"scaleY\":1,\"angle\":0,\"flipX\":false,\"flipY\":false,\"opacity\":1,\"shadow\":null,\"visible\":true,\"clipTo\":null,\"backgroundColor\":\"\",\"fillRule\":\"nonzero\",\"globalCompositeOperation\":\"source-over\",\"transformMatrix\":null,\"skewX\":0,\"skewY\":0,\"crossOrigin\":\"\",\"alignX\":\"none\",\"alignY\":\"none\",\"meetOrSlice\":\"meet\",\"src\":\"data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/2wBDAQMDAwQDBAgEBAgQCwkLEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBD/wAARCABkAGQDASIAAhEBAxEB/8QAFQABAQAAAAAAAAAAAAAAAAAAAAn/xAAUEAEAAAAAAAAAAAAAAAAAAAAA/8QAFAEBAAAAAAAAAAAAAAAAAAAAAP/EABQRAQAAAAAAAAAAAAAAAAAAAAD/2gAMAwEAAhEDEQA/AKpgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA//Z\",\"filters\":[],\"resizeFilters\":[]},{\"type\":\"rect\",\"originX\":\"center\",\"originY\":\"center\",\"left\":-1493.47,\"top\":-1436.37,\"width\":0,\"height\":0,\"fill\":\"rgb(0,0,0)\",\"stroke\":null,\"strokeWidth\":1,\"strokeDashArray\":null,\"strokeLineCap\":\"butt\",\"strokeLineJoin\":\"miter\",\"strokeMiterLimit\":10,\"scaleX\":6.02,\"scaleY\":6.02,\"angle\":0,\"flipX\":false,\"flipY\":false,\"opacity\":1,\"shadow\":null,\"visible\":true,\"clipTo\":\"function(ctx){\\r\\n\\t\\t\\t\\t\\t\\t\\t\\treturn lumise.objects.clipto(ctx, obj);\\r\\n\\t\\t\\t\\t\\t\\t\\t}\",\"backgroundColor\":\"\",\"fillRule\":\"nonzero\",\"globalCompositeOperation\":\"source-over\",\"transformMatrix\":null,\"skewX\":0,\"skewY\":0,\"rx\":0,\"ry\":0},{\"type\":\"i-text\",\"originX\":\"center\",\"originY\":\"center\",\"left\":30328.3,\"top\":2043.65,\"width\":77.94,\"height\":33.9,\"fill\":\"#546e7a\",\"stroke\":\"\",\"strokeWidth\":0,\"strokeDashArray\":null,\"strokeLineCap\":\"butt\",\"strokeLineJoin\":\"miter\",\"strokeMiterLimit\":10,\"scaleX\":152.55,\"scaleY\":229.06,\"angle\":0,\"flipX\":false,\"flipY\":false,\"opacity\":1,\"shadow\":null,\"visible\":true,\"clipTo\":\"function(ctx) {\\r\\n\\t\\t\\t\\t\\t\\ttry{\\r\\n\\t\\t\\t\\t\\t\\t\\treturn lumise.objects.clipto(ctx, object);\\r\\n\\t\\t\\t\\t\\t\\t}catch(ex){}\\r\\n\\t\\t\\t }\",\"backgroundColor\":\"\",\"fillRule\":\"nonzero\",\"globalCompositeOperation\":\"source-over\",\"transformMatrix\":null,\"skewX\":0,\"skewY\":0,\"text\":\"Oswald\",\"fontSize\":\"30\",\"fontWeight\":\"normal\",\"fontFamily\":\"\\\"Oswald\\\"\",\"fontStyle\":\"\",\"lineHeight\":1.16,\"textDecoration\":\"\",\"textAlign\":\"center\",\"textBackgroundColor\":\"\",\"charSpacing\":0,\"styles\":{}},{\"type\":\"i-text\",\"originX\":\"center\",\"originY\":\"center\",\"left\":11819.19,\"top\":-7288.11,\"width\":100.17,\"height\":33.9,\"fill\":\"#546e7a\",\"stroke\":\"\",\"strokeWidth\":0,\"strokeDashArray\":null,\"strokeLineCap\":\"butt\",\"strokeLineJoin\":\"miter\",\"strokeMiterLimit\":10,\"scaleX\":36.24,\"scaleY\":36.24,\"angle\":0,\"flipX\":false,\"flipY\":false,\"opacity\":1,\"shadow\":null,\"visible\":true,\"clipTo\":\"function(ctx) {\\r\\n\\t\\t\\t\\t\\t\\ttry{\\r\\n\\t\\t\\t\\t\\t\\t\\treturn lumise.objects.clipto(ctx, object);\\r\\n\\t\\t\\t\\t\\t\\t}catch(ex){}\\r\\n\\t\\t\\t }\",\"backgroundColor\":\"\",\"fillRule\":\"nonzero\",\"globalCompositeOperation\":\"source-over\",\"transformMatrix\":null,\"skewX\":0,\"skewY\":0,\"text\":\"Pacifico\",\"fontSize\":\"30\",\"fontWeight\":\"normal\",\"fontFamily\":\"\\\"Pacifico\\\"\",\"fontStyle\":\"\",\"lineHeight\":1.16,\"textDecoration\":\"\",\"textAlign\":\"center\",\"textBackgroundColor\":\"\",\"charSpacing\":0,\"styles\":{}},{\"type\":\"i-text\",\"originX\":\"center\",\"originY\":\"center\",\"left\":1925.33,\"top\":-6128.41,\"width\":140.57,\"height\":33.9,\"fill\":\"#546e7a\",\"stroke\":\"\",\"strokeWidth\":0,\"strokeDashArray\":null,\"strokeLineCap\":\"butt\",\"strokeLineJoin\":\"miter\",\"strokeMiterLimit\":10,\"scaleX\":36.24,\"scaleY\":36.24,\"angle\":0,\"flipX\":false,\"flipY\":false,\"opacity\":1,\"shadow\":null,\"visible\":true,\"clipTo\":\"function(ctx) {\\r\\n\\t\\t\\t\\t\\t\\ttry{\\r\\n\\t\\t\\t\\t\\t\\t\\treturn lumise.objects.clipto(ctx, object);\\r\\n\\t\\t\\t\\t\\t\\t}catch(ex){}\\r\\n\\t\\t\\t }\",\"backgroundColor\":\"\",\"fillRule\":\"nonzero\",\"globalCompositeOperation\":\"source-over\",\"transformMatrix\":null,\"skewX\":0,\"skewY\":0,\"text\":\"Righteous\",\"fontSize\":\"30\",\"fontWeight\":\"normal\",\"fontFamily\":\"\\\"Righteous\\\"\",\"fontStyle\":\"\",\"lineHeight\":1.16,\"textDecoration\":\"\",\"textAlign\":\"center\",\"textBackgroundColor\":\"\",\"charSpacing\":0,\"styles\":{}},{\"type\":\"i-text\",\"originX\":\"center\",\"originY\":\"center\",\"left\":6600.45,\"top\":4816.44,\"width\":140.57,\"height\":33.9,\"fill\":\"#546e7a\",\"stroke\":\"\",\"strokeWidth\":0,\"strokeDashArray\":null,\"strokeLineCap\":\"butt\",\"strokeLineJoin\":\"miter\",\"strokeMiterLimit\":10,\"scaleX\":36.24,\"scaleY\":50.03,\"angle\":0,\"flipX\":false,\"flipY\":true,\"opacity\":1,\"shadow\":null,\"visible\":true,\"clipTo\":\"function(ctx) {\\r\\n\\t\\t\\t\\t\\t\\ttry{\\r\\n\\t\\t\\t\\t\\t\\t\\treturn lumise.objects.clipto(ctx, object);\\r\\n\\t\\t\\t\\t\\t\\t}catch(ex){}\\r\\n\\t\\t\\t }\",\"backgroundColor\":\"\",\"fillRule\":\"nonzero\",\"globalCompositeOperation\":\"source-over\",\"transformMatrix\":null,\"skewX\":0,\"skewY\":0,\"text\":\"Righteous\",\"fontSize\":\"30\",\"fontWeight\":\"normal\",\"fontFamily\":\"\\\"Righteous\\\"\",\"fontStyle\":\"\",\"lineHeight\":1.16,\"textDecoration\":\"\",\"textAlign\":\"center\",\"textBackgroundColor\":\"\",\"charSpacing\":0,\"styles\":{}},{\"type\":\"svg\",\"originX\":\"center\",\"originY\":\"center\",\"left\":4910.92,\"top\":4292.27,\"width\":60,\"height\":60,\"fill\":\"rgb(0,0,0)\",\"stroke\":\"\",\"strokeWidth\":0,\"strokeDashArray\":null,\"strokeLineCap\":\"butt\",\"strokeLineJoin\":\"miter\",\"strokeMiterLimit\":10,\"scaleX\":36.24,\"scaleY\":36.24,\"angle\":0,\"flipX\":false,\"flipY\":false,\"opacity\":1,\"shadow\":null,\"visible\":true,\"clipTo\":\"function(ctx) {\\r\\n\\t\\t\\t\\t return lumise.objects.clipto(ctx, image);\\r\\n\\t\\t\\t\\t }\",\"backgroundColor\":\"\",\"fillRule\":\"nonzero\",\"globalCompositeOperation\":\"source-over\",\"transformMatrix\":null,\"skewX\":0,\"skewY\":0,\"crossOrigin\":\"\",\"alignX\":\"none\",\"alignY\":\"none\",\"meetOrSlice\":\"meet\",\"src\":\"data:image/svg xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgdmlld0JveD0iLTEwLC0xMCwxMjAsMTIwIiB3aWR0aD0iMTIwIiBoZWlnaHQ9IjEyMCI PHBvbHlnb24gcG9pbnRzPSIwIDAsIDAgMTAwLCAyNSAxMDAsIDI1IDI1LCA3NSAyNSwgNzUgNzUsIDI1IDc1LCAyNSAxMDAsIDEwMCAxMDAsIDEwMCAwIj48L3BvbHlnb24 PC9zdmc \",\"filters\":[],\"resizeFilters\":[]},{\"type\":\"i-text\",\"originX\":\"center\",\"originY\":\"center\",\"left\":1206.53,\"top\":292.18,\"width\":145.74,\"height\":33.9,\"fill\":\"#546e7a\",\"stroke\":\"\",\"strokeWidth\":0,\"strokeDashArray\":null,\"strokeLineCap\":\"butt\",\"strokeLineJoin\":\"miter\",\"strokeMiterLimit\":10,\"scaleX\":6.02,\"scaleY\":6.02,\"angle\":0,\"flipX\":false,\"flipY\":false,\"opacity\":1,\"shadow\":null,\"visible\":true,\"clipTo\":\"function(ctx) {\\r\\n\\t\\t\\t\\t\\t\\ttry{\\r\\n\\t\\t\\t\\t\\t\\t\\treturn lumise.objects.clipto(ctx, object);\\r\\n\\t\\t\\t\\t\\t\\t}catch(ex){}\\r\\n\\t\\t\\t }\",\"backgroundColor\":\"\",\"fillRule\":\"nonzero\",\"globalCompositeOperation\":\"source-over\",\"transformMatrix\":null,\"skewX\":0,\"skewY\":0,\"text\":\"Quicksand\",\"fontSize\":\"30\",\"fontWeight\":\"normal\",\"fontFamily\":\"\\\"Quicksand\\\"\",\"fontStyle\":\"\",\"lineHeight\":1.16,\"textDecoration\":\"\",\"textAlign\":\"center\",\"textBackgroundColor\":\"\",\"charSpacing\":0,\"styles\":{}},{\"type\":\"i-text\",\"originX\":\"center\",\"originY\":\"center\",\"left\":298.5,\"top\":443.13,\"width\":77.94,\"height\":33.9,\"fill\":\"#546e7a\",\"stroke\":\"\",\"strokeWidth\":0,\"strokeDashArray\":null,\"strokeLineCap\":\"butt\",\"strokeLineJoin\":\"miter\",\"strokeMiterLimit\":10,\"scaleX\":1,\"scaleY\":2.67,\"angle\":0,\"flipX\":false,\"flipY\":false,\"opacity\":1,\"shadow\":null,\"visible\":true,\"clipTo\":\"function(ctx) {\\r\\n\\t\\t\\t\\t\\t\\ttry{\\r\\n\\t\\t\\t\\t\\t\\t\\treturn lumise.objects.clipto(ctx, object);\\r\\n\\t\\t\\t\\t\\t\\t}catch(ex){}\\r\\n\\t\\t\\t }\",\"backgroundColor\":\"\",\"fillRule\":\"nonzero\",\"globalCompositeOperation\":\"source-over\",\"transformMatrix\":null,\"skewX\":0,\"skewY\":0,\"text\":\"Oswald\",\"fontSize\":\"30\",\"fontWeight\":\"normal\",\"fontFamily\":\"\\\"Oswald\\\"\",\"fontStyle\":\"\",\"lineHeight\":1.16,\"textDecoration\":\"\",\"textAlign\":\"center\",\"textBackgroundColor\":\"\",\"charSpacing\":0,\"styles\":{}},{\"type\":\"i-text\",\"originX\":\"center\",\"originY\":\"center\",\"left\":295.5,\"top\":180.13,\"width\":186.12,\"height\":33.9,\"fill\":\"#546e7a\",\"stroke\":\"\",\"strokeWidth\":0,\"strokeDashArray\":null,\"strokeLineCap\":\"butt\",\"strokeLineJoin\":\"miter\",\"strokeMiterLimit\":10,\"scaleX\":1,\"scaleY\":1,\"angle\":0,\"flipX\":false,\"flipY\":false,\"opacity\":1,\"shadow\":null,\"visible\":true,\"clipTo\":\"function(ctx) {\\r\\n\\t\\t\\t\\t\\t\\ttry{\\r\\n\\t\\t\\t\\t\\t\\t\\treturn lumise.objects.clipto(ctx, object);\\r\\n\\t\\t\\t\\t\\t\\t}catch(ex){}\\r\\n\\t\\t\\t }\",\"backgroundColor\":\"\",\"fillRule\":\"nonzero\",\"globalCompositeOperation\":\"source-over\",\"transformMatrix\":null,\"skewX\":0,\"skewY\":0,\"text\":\"Fredoka One\",\"fontSize\":\"30\",\"fontWeight\":\"normal\",\"fontFamily\":\"\\\"Fredoka One\\\"\",\"fontStyle\":\"\",\"lineHeight\":1.16,\"textDecoration\":\"\",\"textAlign\":\"center\",\"textBackgroundColor\":\"\",\"charSpacing\":0,\"styles\":{}},{\"type\":\"i-text\",\"originX\":\"center\",\"originY\":\"center\",\"left\":298.5,\"top\":287.13,\"width\":273.15,\"height\":33.9,\"fill\":\"#546e7a\",\"stroke\":\"\",\"strokeWidth\":0,\"strokeDashArray\":null,\"strokeLineCap\":\"butt\",\"strokeLineJoin\":\"miter\",\"strokeMiterLimit\":10,\"scaleX\":1,\"scaleY\":1,\"angle\":0,\"flipX\":false,\"flipY\":false,\"opacity\":1,\"shadow\":null,\"visible\":true,\"clipTo\":\"function(ctx) {\\r\\n\\t\\t\\t\\t\\t\\ttry{\\r\\n\\t\\t\\t\\t\\t\\t\\treturn lumise.objects.clipto(ctx, object);\\r\\n\\t\\t\\t\\t\\t\\t}catch(ex){}\\r\\n\\t\\t\\t }\",\"backgroundColor\":\"\",\"fillRule\":\"nonzero\",\"globalCompositeOperation\":\"source-over\",\"transformMatrix\":null,\"skewX\":0,\"skewY\":0,\"text\":\"Oleo Script Swash Caps\",\"fontSize\":\"30\",\"fontWeight\":\"normal\",\"fontFamily\":\"\\\"Oleo Script Swash Caps\\\"\",\"fontStyle\":\"\",\"lineHeight\":1.16,\"textDecoration\":\"\",\"textAlign\":\"center\",\"textBackgroundColor\":\"\",\"charSpacing\":0,\"styles\":{}}],\"background\":\"#fff\"} ' ;
    
        
        canvas.loadFromJSON(json, canvas.renderAll.bind(canvas), function(o, object) {
            fabric.log(o, object);
            if(object.type == "image"){
                    image = object.src;
            };
        });