在fabricjs中，Base64图像数据无法使用loadfromJSON

Base64 image data not working with loadfromJSON in fabricjs

本文关键字：loadfromJSON 数据 图像 fabricjs Base64      更新时间：2023-09-26

我正在尝试加载一个带有图像对象的json对象。图像对象具有作为背景的基本64图像数据。但是我无法使用loadFromJSON方法。

代码：

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();

它显示一个错误为"Error loading data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAn4AAAFPCAYAAADTHsP1AAAgAElEQ…Lv/vuU1wVsyvXK+Kks1f6gffSCThZ1km3u6NFklCnFes//AbZzi+iGF3/7AAAAAElFTkSuQmCC "

如果您使用最新的fabric.js版本，这是一个错误。我已经通过提取请求#800解决了这个问题：https://github.com/kangax/fabric.js/pull/800.

顺便说一句，你上面代码的base64数据URL不正确——它有三个点（lEQ…Lv/vuU）。可能是复制的副作用。

相关文章：