HTML5 캔버스 scale()

1 개요[ | ]

HTML5 canvas scale() Method
HTML5 캔버스 scale()

컨텍스트에 x축, y축 방향으로 크기조정(확대·축소)을 적용하는 함수
적용 이후 그리는 도형의 (x, y) 좌표, 길이, 선의 두께에 모두 적용됨

2 예시[ | ]

html

Copy

<canvas id='myCanvas' width='100', height='100'></canvas>
<script>
var ctx = document.getElementById('myCanvas').getContext('2d');
 
ctx.strokeRect(10,10,30,30);
ctx.scale(2,2);
ctx.strokeRect(10,10,30,30);
</script>

→ ( 10, 10 ) 위치에 30 x 30 사각형을 그린 후

→ ( 20, 20 ) 위치에 60 x 60 사각형을 그린다.

3 같이 보기[ | ]

4 참고[ | ]