자바스크립트
[JS] 캔버스 Canvas 도형 확대 축소 후 원점 조정하기
[JS] 캔버스 Canvas 도형 확대 축소 후 원점 조정하기
2024.04.24도형 사이즈 조정 메서드ctx.scale(x, y) : 도형 크기 확대/축소. 캔버스에서 1단위는 1픽셀. scale(2, 2)는 하나의 단위를 2픽셀로 확대(좌표 사이의 간격 증가).ctx.translate(x, y) : 캔버스의 원점 이동. 기본값은 왼쪽 좌상단 (0, 0).ctx.rotate(angle) : 도형을 라디안(angle) 단위만큼 시계 방향으로 회전. 항상 캔버스 원점이 회전의 중심.ctx.transform(scaleX, skewX, skewY, scaleY, translateX, translateY)scale(), rotate(), translate() 일괄 적용하는 메서드.이전 변형 결과값에 이어서 수행.초기 상태에서 transform(1.2, 0, 0, 1.2, -30, -30)을..