キャンバス用のタイルベースの表示グリッドの構築に取り組んできました。これは私がこれまでに持っているものです: http://jsfiddle.net/dDmTf/7/
私が抱えていて、完全に把握できないいくつかの問題は次のとおりです。
最初の読み込み時間はばかげています...何が間違っているのかわかりません-修正、想定よりも^32多くレンダリングしていたことがわかりました- タイルの境界線を「強調表示する」だけのホバー効果がそれを消去し、キャンバス全体を再レンダリングせずに前のタイルを回復する方法がありません。
タイルシートを使用して、小さな画像の束ではなく単一の画像を提供するにはどうすればよいですかウィンドウのサイズを変更すると (キャンバスのサイズも変更されます)、キャンバスも消去されます。再レンダリングする必要がありますか? または、幅/高さが変更されたときにさまざまな状態を維持できますか?onresizeマップを再レンダリングするコールバックを追加しました。しかし、最善の方法ではないかもしれませんか？- 多層？透明な.pngファイルが互いにオーバーレイできるようにするにはどうすればよいですか
これらは私が今立ち往生している主な問題であり、どんなガイダンスも大歓迎です。
また、私の javascript へのポインタがあれば、お気軽に! 私は行くにつれてそれをもっと学んでいます、そして私は多くのことを間違っていると確信しています.
編集
参考までに、現在jsfiddleに表示されているスプライトマップをコピーして貼り付けました。使用する予定のものではありませんが、アップロードするよりは簡単でした。そのタイルシートの 16x16 グリッド (と思われるもの) ではなく、32x32 グリッドを維持する予定です。
編集
現在、32x32 のタイルシートが表示されていますが、ホバー効果によってまだ壊れており、古い値が何であったかを「知る」方法がわかりません。