canvas line 썸네일형 리스트형 HTML5 Canvas Line2 오늘은 Line 굵기를 조절하는 방법과 선의 색깔, 그리고 선의 끝 맺음 처리를 다양하게 시도해 보겠다. 선의 굵기를 지정하는 lineWidth가 존재한다. context.lineWidth=[value]; 선의 굴기를 지정해보자. 위 소스의 실행 결과는 아래와 같다. 선의 색상을 지정해보자. 위 소스 코드에 아래 소스를 추가한다. context.strokeStyle="#fff000"; 실행 결과는 아래와 같다. 이제 선 lineCap을 사용한 예제를 확인 해보자. 실행 결과는 아래와 같다. 더보기 HTML5 Canvas Line1 HTML5 Canvas 강좌를 시작해보고자 한다. 첫 번째 주제는 Canvas Line이다. Canvas 브라우저 지원 현황 (출처 : http://www.findmebyip.com/litmus) 우선 Line을 그리기 위하여 Canvas 엘리먼트를 만들자. 9라인은 Canvas 엘리먼트의 마크업 형식이며 초기에는 아무 내용도 없고 경계선도 없다. Canvas에 접근하기 위한 id속성과 Canvas크기를 width와 height를 각각 지정하였다. 5번라인은 DOM에서 Canvas 엘리먼트를 찾게 되며 모든 Canvas는 드로잉 컨텍스트를 갖으며 6번라인은 Canvas에 대해 getContext() 메소드를 호출할 수 있다. 이때 "2d"라는 문자열을 getContext() 메소드에 넘겨줘야 한다. 여기.. 더보기 이전 1 다음
