fabricjs
FabricJS canvas Serialisatie

Angular 2 AngularJS CSS HTML html5-canvas JavaScript jQuery Node.js PHP SVG
Zoeken…


Invoering

Als u eenmaal bent begonnen met het bouwen van een applicatie met FabricJS, zal het niet laat zijn wanneer u zich realiseert dat u de resultaten van het canvas / de inhoud ervan op de server moet opslaan. Of kan ze exporteren als bestanden naar de client. Voor dit doel hebt u canvasserialisatie nodig. Nu zullen sommigen van u zich misschien afvragen waarom serialisatie we het kunnen opslaan als een afbeelding. Dus het antwoord zou het opslaan van een afbeelding op een server bandbreedte nodig hebben en tekst blijkt in dit geval veel beter.

Syntaxis

  1. JSON.stringify (canvas) - roept impliciet de toJSON-methode op voor het doorgegeven object. Geeft tekenreeksrepresentatie
  2. canvas.toObject () - retourneert dezelfde weergave als toJSON, alleen in de vorm van een daadwerkelijk object
  3. canvas.toSVG () - retourneert een SVG-weergave van het canvas

Opmerkingen

Voor meer informatie over FabricJS canvasserialisatie Raadpleeg de link Canvasserialisatie

Serilisatie van canvas

<canvas id = "canvas" height='400' width='500'></canvas>

var canvas = new fabric.Canvas(document.getElementById('canvas'));
console.log(JSON.stringify(canvas)); // '{"objects":[],"background":""}'

canvas.add(new fabric.Rect({
  left: 10,
  top: 10,
  height: 50,
  width: 50,
  fill: 'green',
     stroke:'black'
}));
canvas.renderAll();

console.log(JSON.stringify(canvas));//logs the string representation
console.log(canvas.toObject());//logs canvas as an object
console.log(canvas.toSVG());//logs the SVG representation of canvas

Viool



Modified text is an extract of the original Stack Overflow Documentation
Licentie onder CC BY-SA 3.0
Niet aangesloten bij Stack Overflow