Suche…


Einführung

Nachdem Sie mit FabricJS eine Anwendung erstellt haben, ist es nicht zu spät, wenn Sie feststellen, dass Sie die Ergebnisse der Zeichenfläche / des Inhalts auf dem Server speichern müssen. Oder sie können als Dateien an den Client exportiert werden. Zu diesem Zweck benötigen Sie Canvas-Serialisierung . Nun fragen einige von Ihnen, warum die Serialisierung wir als Bild speichern können. Die Antwort wäre also das Speichern eines Bildes auf einem Server erfordert Bandbreite und Text erweist sich in diesem Fall als viel besser.

Syntax

  1. JSON.stringify (Canvas) - Ruft die JSON-Methode für das übergebene Objekt implizit auf. Gibt eine Zeichenfolgendarstellung aus
  2. canvas.toObject () - gibt dieselbe Darstellung wie toJSON zurück, nur in Form eines tatsächlichen Objekts
  3. canvas.toSVG () - gibt eine SVG-Darstellung der Leinwand zurück

Bemerkungen

Weitere Informationen zur FabricJS-Canvas-Serialisierung finden Sie im Link Canvas-Serialisierung

Canvas-Serilisierung

<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

Geige



Modified text is an extract of the original Stack Overflow Documentation
Lizenziert unter CC BY-SA 3.0
Nicht angeschlossen an Stack Overflow