The CanvasRenderingContext2D
.restore()
method of the Canvas 2D API restores the most recently saved canvas state by popping the top entry in the drawing state stack. If there is no saved state, this method does nothing.
Fore more information about the drawing state, see CanvasRenderingContext2D.save()
.
Syntax
void ctx.restore();
Examples
Restoring a saved state
This example uses the save()
method to save the default state and restore()
to restore it later, so that you are able to draw a rect with the default state later.
HTML
<canvas id="canvas"></canvas>
JavaScript
const canvas = document.getElementById('canvas'); const ctx = canvas.getContext('2d'); // Save the default state ctx.save(); ctx.fillStyle = 'green'; ctx.fillRect(10, 10, 100, 100); // Restore the default state ctx.restore(); ctx.fillRect(150, 40, 100, 100);
Result
Specifications
Specification | Status | Comment |
HTML Living StandardThe definition of 'CanvasRenderingContext2D.restore' in that specification. | Living Standard |
Browser compatibility
The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
Update compatibility data on GitHub
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
restore
|
Chrome
Full support Yes |
Edge
Full support 12 |
Firefox
Full support 1.5 |
IE
Full support Yes |
Opera
Full support Yes |
Safari
Full support Yes |
WebView Android
Full support Yes |
Chrome Android
Full support Yes |
Firefox Android
Full support 4 |
Opera Android
Full support Yes |
Safari iOS
Full support Yes |
Samsung Internet Android
Full support Yes |
Legend
- Full support
- Full support
See also
- The interface defining this method:
CanvasRenderingContext2D
CanvasRenderingContext2D.save()
CanvasRenderingContext2D.restore() by Mozilla Contributors is licensed under CC-BY-SA 2.5.