HTML5 Canvas Save & Restore

RadialGradient & Save & Restore Playground

HTML

<input type="button" value="click" onclick="change()"/>
<br/>
<canvas id="canvas" width="300" height="300"></canvas>

JavaScript

var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
ctx.beginPath();
ctx.moveTo(100,100);
ctx.lineTo(100,200);
ctx.stroke();

var saved_rect = ctx.getImageData(0, 0, 300, 300);
console.log(saved_rect);

function change(){
	ctx.clearRect(0,0,300,300);
  ctx.putImageData(saved_rect,0,0);
  ctx.beginPath();
  ctx.moveTo(100,200);
  ctx.lineTo(200,200);
  ctx.stroke();
}