CanvasRenderingContext2D.save()

Baseline Widely available

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

CanvasRenderingContext2D.save() - метод Canvas 2D API. Сохраняет все состояния и добавляет текущее состояние в стек.

Состояние чертежа

Состояние чертежа, которое сохраняется в стеке, состоит из:

Синтаксис

void ctx.save();

Пример

Сохранение состояния чертежа

Этот пример использует метод save() для сохранения состояния по умолчанию, и метод restore() для восстановления состояния позже, чтобы позже можно было нарисовать прямоугольник с состоянием по умолчанию.

HTML

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

JavaScript

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

// Сохранение состояния по умолчанию
ctx.save();

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

// Восстановление состояния по умолчанию
ctx.restore();

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

Результат

Спецификации

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

Совместимость с браузерами

Смотрите также