HTML5 Canvas를 이용한 drawing

HTML5의 새로운 요소 중에 canvas라고, 그림판 비슷하게 그림을 그릴 수 있는 부분이 있다. 등장배경은 잘 모르겠지만 플래시 때문이 아닐까 조심스럽게 생각하고 있는데...

예전에 학교 수업중 "컴퓨터 그래픽스"라는 과목이 있었다. 이 과목은 대학교 수업 중 나에게 큰 영향을 끼친 과목 중 하나로, 3차원 그래픽 정보가 담겨 있는 mesh파일에 있는 vertex와 face정보를 가지고 폴리곤을 그리고 쉐이딩, 은면 제거 등등 여러 가지 기술을 구현하는 것이 목표였던 과목이었다. 이렇게 쓰면 대단한 것이 아닐거 같지만, 오로지 setPixel이라는 함수 하나를 가지고 만들어야 하는것이 전제 조건이었다. 이 점을 찍는 함수 하나를 가지고 선을 그리고, 그 최적화를 위해 bresenham알고리즘을 사용하고, 삼각형을 그리고, 반시계방향으로 진행하면서 내/외부를 판별하고, 행렬계산을 통해 3차원으로 만들고 은면 제거에, z-buffer에 구로 쉐이딩에....

하여간 오래 전에 들었던 과목이라 잘 기억이 나지는 않지만, 얼마 전 친구에게 이 과목의 강의안을 다시 구했고 해서, 복습하는 셈치고 다시 한번 시도해보겠다. 물론 제목대로 이번엔 openGL이 아닌 HTML5의 Canvas를 가지고 말이다.

해보는거야 해보는데, 아직 잘 모르겠지만 이거 자바스크립트로 그리던데, 속도가 어떻게 될지 모르겠다. 알고리즘의 속도 등은 구글 크롬의 개발자도구로 측정할 수 있을거 같고...

근데 되긴 될까?