반응형
캔버스좌표
-
JavaScript 입문 : Canvas Animation II - 클릭이벤트(PointerEvent)를 이용하여 원 찍어내기컴퓨터 알아가기/JavaScript 2022. 11. 8. 19:30
Canvas Animation 2번째 시간입니다. 지난 시간 초록색 원을 그려 보았고 이제는 마우스 클릭 이벤트를 이용하여 클릭때마다 원을 만들어 볼 예정입니다. 이미 설명 하였듯이 이렇게 미리 만들어 놓은 프로그램(라이브러리)을 이용하는 것이 아니라 순수하게 자바스크립트 언어만으로 결과를 만들어 내는 것을 특히 '바닐라 자바스크립트'라고 불립니다. 역시 Animation 학습은 'Franks laboratory의 Master HTML Canvas 2021'을 기본으로 공부합니다. 1. 원 만들기 기본 지난 시간 초록색 원을 만든 전체 코드는 다음과 같습니다. 2. 클릭하면 원 만들어지기 지금부터는 함수를 이용하여 Canvas내 원을 만들고 각 좌표를 확인하는 방법을 공부할 차례입니다. 먼저 위 코드에서..