본문 바로가기

html5

HTML5 Canvas Line2


오늘은 Line 굵기를 조절하는 방법과 선의 색깔, 그리고 선의 끝 맺음 처리를 다양하게 시도해 보겠다.

선의 굵기를 지정하는 lineWidth가 존재한다.

context.lineWidth=[value];

선의 굴기를 지정해보자.





위 소스의 실행 결과는 아래와 같다.

선의 색상을 지정해보자. 위 소스 코드에 아래 소스를 추가한다.

context.strokeStyle="#fff000";

실행 결과는 아래와 같다.


이제 선 lineCap을 사용한 예제를 확인 해보자.










실행 결과는 아래와 같다.

'html5' 카테고리의 다른 글

HTML5 Canvas Shapes 2  (1) 2011.04.21
HTML5 Canvas Shapes 1  (0) 2011.04.20
HTML5 Canvas Line1  (0) 2011.04.19