ようやくcanvasを使ってみました。 基本中の基本、canvas領域に四角形を表示させてみます。 図形を描く領域を用意する まずは図形を描く領域を作ります。 やり方はとても簡単です。 html5のソース内の領域を表示させたいところに以下を追加します。 <canvas id="canvas" width="200" height="200"></canvas> id、width、heightは任意です。 分かりやすくするためにスタイルシートで背景画像を指定して枠線をつけました。 サンプルを見る 図形を描画するための準備 図形を描くにはJavascriptを使います。 以下ソースを書きます。 onload = function(){ canvas = document.getElementById('canvas'); ctx = canvas.getContext('2d');