강좌 & 팁
CanvasRenderingContext2D.save()
설명
현재 컴퍼스의 적용된 상태를 스택에 저장합니다.
분류
상태 API
형태
void CanvasRenderingContext2D.save();
인수
없음
반환
없음
예제
<html>
<head>
<script type="application/javascript">
function draw() {
var canvas = document.getElementById("canvas");
if (canvas.getContext) {
var ctx = canvas.getContext("2d");
ctx.fillStyle = "rgb(200,0,0)";
ctx.fillRect (10, 10, 40, 40);
ctx.save();
ctx.translate( 50, 0 );
ctx.fillStyle = "rgb(0,200,0)";
ctx.fillRect (10, 10, 40, 40);
ctx.restore();
ctx.save();
ctx.translate( 0, 50 );
ctx.fillStyle = "rgb(0,0, 200)";
ctx.fillRect (10, 10, 40, 40);
ctx.restore();
ctx.save();
ctx.translate( 50, 50 );
ctx.fillStyle = "rgb(0,0,0)";
ctx.fillRect (10, 10, 40, 40);
ctx.restore();
}
}
</script>
</head>
<body onload="draw();">
<canvas id="canvas" width="150" height="150"></canvas>
</body>
</html>
결과