Canvas기본

devAnderson·2022년 2월 24일
0

TIL

목록 보기
62/102

📱 Canvas란

그림을 그릴 때 도화지 역할을 하는 캔버스의 의미처럼, Canvas태그는 그 내부에서 도형, 데이터, 애니메이션 등 다양한 내용들을 그릴 수 있는 태그이다

📱 Canvas 설정

주의! canvas를 css로 width와 height을 설정할 경우, 내부에 있는 옵션들이 제대로 작동하지 않는다.
반드시, inline 형태로 설정해주거나 아니면 js를 통해 설정해줘야한다 ( 조금 이해는 안되지만 )

📱 그림을 그려보자

사각형 그려보기

위 메서드는 ctx 객체 내장된 프로토타입 메서드이다.

line 추가하기

영역 지우기

📱 이벤트를 등록해보자

profile
자라나라 프론트엔드 개발새싹!

0개의 댓글