캔버스는 빈 상태로 시작된다. 무언가를 그려 넣어 보자.

여기를 클릭하면..
캔버스에 사각형을 그리기 위해서 다음과 같은 스크립트를 만들었다.

<script> 
function draw_b () { 
  var b_canvas = document.getElementById ("b"); 
  var b_context = b_canvas.getContext ("2d"); 
  b_context.fillRect (50, 25, 150, 100); 
} 
</script> 
 

getElementByid로 DOM 안에서 canvas를 찾아낸다. 그 후 getContext 메서드를 호출해서 캔버스를 제어하기 위한 문맥을 얻어낸다.