CanvasRenderingContext2D.save()

El método CanvasRenderingContext2D.save() del API Canvas 2D guarda el estado completo del canvas añadiendo el estado actual a una pila.

El estado del dibujo

El estado del dibujo que se almacena en una pila consiste en los siguientes elementos:

Sintaxis

void ctx.save();

Ejemplos

Guardando el estado del dibujo

Este ejemplo usa el método save() para guardar el estado por defecto y el método restore() para restaurarlo luego, de tal manera que luego se puede dibujar el segundo rectángulo con el estado por defecto.

HTML

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

JavaScript

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

// Guardar el estado por defecto
ctx.save();

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

// Restaurar el estado por defecto
ctx.restore();

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

Resultado

Especificaciones

Especificación Estado Comentarios
HTML Living Standard
La definición de 'CanvasRenderingContext2D.save' en esta especificación.
Living Standard

Compatibilidad con exploradores

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome para AndroidFirefox para AndroidOpera para AndroidSafari en iOSSamsung Internet
saveChrome Soporte completo SiEdge Soporte completo 12Firefox Soporte completo 1.5IE Soporte completo SiOpera Soporte completo SiSafari Soporte completo SiWebView Android Soporte completo SiChrome Android Soporte completo SiFirefox Android Soporte completo 4Opera Android Soporte completo SiSafari iOS Soporte completo SiSamsung Internet Android Soporte completo Si

Leyenda

Soporte completo  
Soporte completo

Véase también