canvas API - 도형 그리기(basic)
그리드와 좌표 HTML 골격(skeleton)은 가로 세로 각각 150px의 캔버스 요소를 가지고 있다. 위의 그림을 보면, 캔버스와 기본 그리드가 놓인 것을 볼 수 있다. 기본적으로 그리드의 1단위는 캔버스의 1px과 같다. 이 그리드의 원점은 좌측상단의 (0, 0)이다. 모든 요소들은 원점을 기준으로 위치된다. 파란 사각형의 좌상단은 왼쪽에서 x, 오른쪽에서 y 픽셀 떨어진 것으로 볼 수 있다. 그러므로 사각형의 좌표는 (x, y)가 된다. 직사각형 그리기 canvas는 오직 하나의 원시적인 도형인 직사각형을 제공한다. 다른 모든 도형들은 무조건 하나 또는 하나 이상의 path와 여러 점으로 이어진 선으로 만들어진다. 아주 어려운 도형들은 내장 함수들을 통해 그릴 수 있다. fillRect(x, y,..
Programming/Mindchain
2019. 7. 22. 14:50