JavaScriptでCanvasに描画する

手順

以下の二つのファイル

  • test.html
  • test.js

を作成する

test.html

test.js

実行結果

説明

test.html

addEventListenerでDOMContentLoadedを指定するとhtml読み込み完了後関数を実行できる

test.js

domからcanvas要素を配置する場所を取得

domの要素とするcanvas要素を作成

dom内にcanvas要素を配置

canvasの2d情報を取得

塗りつぶした長方形を描画

シェアする

  • このエントリーをはてなブックマークに追加

フォローする