Base64 image data does not work with loadfromJSON in fabricjs

I am trying to load a json object that has an image object. The image object has basic image data 64 as a background. But I can not use the loadFromJSON method.

code:

var jsonDataSet = '{"objects":[{"type":"image","originX":"left","originY":"top","left":0,"top":0,"width":700,"height":600,"fill":"rgb(0,0,0)","overlayFill":null,"stroke":null,"strokeWidth":1,"strokeDashArray":null,"strokeLineCap":"butt","strokeLineJoin":"miter","strokeMiterLimit":10,"scaleX":1,"scaleY":1,"angle":0,"flipX":false,"flipY":false,"opacity":1,"selectable":false,"hasControls":true,"hasBorders":true,"hasRotatingPoint":true,"transparentCorners":true,"perPixelTargetFind":false,"shadow":null,"visible":true,"clipTo":null,"src":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAn4AAAFPCAYAAADTHsP1AAAgAElEQ…Lv/vuU1wVsyvXK+Kks1f6gffSCThZ1km3u6NFklCnFes//AbZzi+iGF3/7AAAAAElFTkSuQmCC","filters":[]}],"background":""}'; canvas.loadFromJSON (jsonDataSet); canvas.renderAll(); 

The error is displayed as "Error loading data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAn4AAAFPCAYAAADTHsP1AAAgAElEQ…Lv/vuU1wVsyvXK+Kks1f6gffSCThZ1km3u6NFklCnFes//AbZzi+iGF3/7AAAAAElFTkSuQmCC "

+6
source share
1 answer

If you are using the latest version of fabric.js, this is a bug. I fixed this with output request # 800: https://github.com/kangax/fabric.js/pull/800 .

By the way, your base dataURL code of your above code is incorrect - it has three points (lEQ ... Lv / vuU). Probably a side effect of copying.

+4
source

Source: https://habr.com/ru/post/952175/


All Articles