Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.

View in English Always switch to English

CanvasRenderingContext2D: save()-Methode

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨Juli 2015⁩.

Die CanvasRenderingContext2D.save() Methode der Canvas 2D API speichert den gesamten Zustand der Leinwand, indem sie den aktuellen Zustand auf einen Stapel schiebt.

Der Zeichen-Zustand

Der Zeichen-Zustand, der auf den Stapel gespeichert wird, besteht aus:

Syntax

js
save()

Parameter

Keine.

Rückgabewert

Keine (undefined).

Beispiele

Den Zeichen-Zustand speichern

Dieses Beispiel verwendet die save()-Methode, um den aktuellen Zustand zu speichern, und restore(), um ihn später wiederherzustellen, damit Sie in der Lage sind, später ein Rechteck mit dem aktuellen Zustand zu zeichnen.

HTML

html
<canvas id="canvas"></canvas>

JavaScript

js
const canvas = document.getElementById("canvas");
const ctx = canvas.getContext("2d");

// Save the current state
ctx.save();

ctx.fillStyle = "green";
ctx.fillRect(10, 10, 100, 100);

// Restore to the state saved by the most recent call to save()
ctx.restore();

ctx.fillRect(150, 40, 100, 100);

Ergebnis

Spezifikationen

Specification
HTML
# dom-context-2d-save-dev

Browser-Kompatibilität

Siehe auch