Canvasを使ったスクリプトを書いていくにあたって、画像データの読み込みについて一考。 ゲームでは画像を多用しますが、Canvas上にそれを描画するには、読み込みが完了してからでなければなりません。 ブラウザでは、画像の読み込みは非同期で行なわれるので、JavaScriptで描画処理を行ないたいと思っても、「その時に」画像読み込みが完了しているとは限りません。 先回までのサンプルプログラムでは、ページ全体の読み込みが完了してから、開始ボタンをクリックして処理を開始していたので、このような問題はありませんでした。しかし実際のゲームでは、そんな都合よいタイミングで処理を開始してくれるわけじゃありません。ですから、「読み込みが完了してから処理開始」というイベント処理がどうしても必要になります。 …で、たいていのJavaScript関係のリファレンス本では、 img=new Image(); i