canvasの概要

はhtml 5に表示される新しいラベルで、すべてのdomオブジェクトのように独自の属性、方法、イベントがあり、その中に図面を描く方法があり、jsはそれを呼び出して図面を描くことができます.
使用する前に、まずcanvasページ要素を新規作成する必要があります.

<canvas id="myCanvas" width="400" height="200">
             canvas！
</canvas>

上のコードでは、ブラウザがこのAPIをサポートしていない場合、canvasラベルの真ん中に「ブラウザはcanvasをサポートしていません!」という文字が表示されます.
各canvas要素には対応するcontextオブジェクト(コンテキストオブジェクト)があり、Canvas APIはこのcontextオブジェクトの上に定義されているので、getContextメソッドを使用してこのオブジェクトを取得する必要があります.

     var canvas = document.getElementById('myCanvas');
     if (canvas.getContext) {
        var ctx = canvas.getContext('2d');
     }

上記のコードでは、getContextメソッドがパラメータ2 dを指定し、このcanvasオブジェクトが2 Dパターン(すなわち平面パターン)を生成するために使用されることを示す.パラメータが3 dであれば、3 D画像(すなわち立体パターン)を生成するために使用されることを示し、この部分は実際にはWebGL APIとは別個に呼ばれる.