Canvasの重ね合わせ
よくある、ダンジョンで
キャラクターが歩いていて
背景画像もその周りにあるというもの
これは、2つのCanvasの重ね合わせで実現てきる
これには、ダンジョンマップ描画のCanvasと
キャラクター画像描画のCanvas
の2つを作成
1つのCanvasに対して
drawImage()で
複数の画像を重ねて描画できるけど
ダンジョンマップの場合
キャラクター画像と
ダンジョンマップの描画の
タイミングが違うので
Canvasを分けている
Canvasの重ね合わせには
CSSを使う
ポイントとしては
各Canvasに対して
position: absolute
を指定すること
これを指定することで
上から順の要素の配置ではなく
leftとtopを使った絶対座標で表示する
ようになる
通常のHTMLでは
要素を順に配置するけと
Canvasの重ね合わせをするには
絶対座標で自由に配置することもある