html canvas 태그에서 사용할 수 있는 함수

html canvas 태그에서 사용할수 있는 대표 함수에 대해서 알아볼까요?

 

---

 

1. getContext('2d')

Canvas 요소의 2D 그래픽 컨텍스트를 얻을수 있습니다.

이 컨텍스트를 사용하여 그림을 그리고 그림을 조작할 수 있습니다.

 

2.fillRect(x, y, width, height)

사각형을 채워 그릴때 사용 합니다.

 

3.strokeRect(x, y, width, height)

사각형의 윤곽선을 그릴수 있습니다.

 

4.clearRect(x, y, width, height)

지정된 사각형 영역을 지우고 투명한 영역을 만듭니다.

 

5.beginPath()

새 경로를 생성하기 위해 경로 리스트를 비웁니다.

 

6.moveTo(x, y)

현재 하위 경로의 시작점을 지정합니다.

 

7.lineTo(x, y)

현재 하위 경로에서 지정된 위치까지 직선을 그립니다.

 

8.stroke()

현재의 스타일로 현재의 하위 경로를 윤곽선으로 그립니다.

 

9.fill()

현재의 스타일로 현재의 하위 경로를 채울 때 사용 합니다.

 

10.arc(x, y, radius, startAngle, endAngle, anticlockwise)

호(arc)를 그릴수 있습니다.

 

11.drawImage(image, x, y, width, height)

이미지를 Canvas에 그릴수 있는 함수입니다.

---

 

 

도움이 되셨길 바랍니다~^^