이번에는 선의 색깔을 바꿔보도록 하겠습니다



 


위 코드를 보면 strokeStyle이라는 속성을 사용하여 line의 색깔을 바꿔 보았습니다.

'canvas' 카테고리의 다른 글

[canvas] text 입력하기  (0) 2013.07.31
[canvas] arc 원호 그리기  (0) 2013.07.30
[canvas] line width  (0) 2013.07.30
[canvas] line 그리기  (0) 2013.07.30
[canvas] canvas template  (0) 2013.07.30

이번에는 앞에서 그린 선의 넓이를 조정해 보겠습니다.




    


소스를 보면 lineWidth가 들어간걸 확인 할 수 있습니다.


이 속성을 사용하여 line의 넓이를 조절 할 수 있습니다.


'canvas' 카테고리의 다른 글

[canvas] text 입력하기  (0) 2013.07.31
[canvas] arc 원호 그리기  (0) 2013.07.30
[canvas] line color  (0) 2013.07.30
[canvas] line 그리기  (0) 2013.07.30
[canvas] canvas template  (0) 2013.07.30

가장 먼저 선을 그려보도록 하겠습니다.



  

 
    

  

선을 그릴때 다음과 같은 메서드를 사용합니다.


beginPath(), moveTo(), lineTo(), stroke()


beginPath()는 새로운 선을 그리겠다고 선언하는 것이고 moveTo()는 시작좌표로 시작점을 나타내고


lineTo()는 끝나는 좌표로 어디까지 그리는지 나타냅니다.


마지막으로 stroke()메서드를 써야 canvas위에 그려지게 됩니다.

'canvas' 카테고리의 다른 글

[canvas] text 입력하기  (0) 2013.07.31
[canvas] arc 원호 그리기  (0) 2013.07.30
[canvas] line color  (0) 2013.07.30
[canvas] line width  (0) 2013.07.30
[canvas] canvas template  (0) 2013.07.30

+ Recent posts