2013-08-21 2 views
6

Ich versuche, ein JSON-Objekt zu laden, das ein Bildobjekt hat. Das Bildobjekt hat 64 Basisbilddaten als Hintergrund. Aber ich kann die loadFromJSON-Methode nicht laden.Base64-Bilddaten funktionieren nicht mit loadfromJSON in fabricjs

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

Es ist ein Fehler als "Error loading data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAn4AAAFPCAYAAADTHsP1AAAgAElEQ…Lv/vuU1wVsyvXK+Kks1f6gffSCThZ1km3u6NFklCnFes//AbZzi+iGF3/7AAAAAElFTkSuQmCC "

Antwort

4

Anzeigen Wenn Sie die neueste Version verwenden fabric.js ist es ein Bug. Ich habe das mit der Pull-Anfrage # 800: https://github.com/kangax/fabric.js/pull/800 behoben.

BTW Ihre Base64 DataURL Ihres obigen Codes ist nicht korrekt - es hat drei Punkte (IEQ ... Lv/vuU). Wahrscheinlich ein Nebeneffekt des Kopierens.

+1

Vielen Dank. Ihre Änderungen hinzugefügt und es funktioniert wie erwartet. – user2571818

+0

Die drei Punkte sind kein Nebeneffekt des Kopierens, sie werden tatsächlich von fabric.js hinzugefügt. Sehen Sie sich die Ausgabe in der Konsole hier an: http://jsfiddle.net/h9q6Lorg/ – BruceHill

+2

Sie werden nicht von fabric.js hinzugefügt. Es ist ein Fehler/eine Einschränkung der console.log in den Chrom Devtools (https://code.google.com/p/chromium/issues/detail?id=464560). http://jsfiddle.net/devxyrro/ – Kienz