rot.jsの他にphina.jsを使っています。
ソースコード
// phina.js をグローバル領域に展開 phina.globalize(); //画面サイズ var WIDTH = 640; var HEIGHT = 960; //block size var blockSize = 20; //縦のブロック数 var cols = WIDTH / blockSize; //横のブロック数 var rows = HEIGHT / blockSize; //offset var offset = blockSize / 2; // MainScene クラスを定義 phina.define('MainScene', { superClass: 'CanvasScene', init: function() { this.superInit({ width: WIDTH, height: HEIGHT, }); // 背景色を指定 this.backgroundColor = '#444'; //マップ配列 var mapArray = new Array(rows); for(var i = 0; i < rows; i++){ mapArray[i] = new Array(cols); } //rot.jsでマップデータを生成 var map = new ROT.Map.Digger( cols, rows, { roomWidth: [3, 6], roomHeight: [3, 6], } ); //マップ配列に情報を書き込む map.create(function(x, y, type){ mapArray[x][y] = type; }); //マップ表示 for(var x = 0; x < cols; x++){ for(var y = 0; y < rows; y++){ //壁ならブロックを配置 if(mapArray[x][y] === 1){ var block = RectangleShape() .setPosition(x * blockSize + offset, y * blockSize + offset) .addChildTo(this); block.width = blockSize; block.height = blockSize; } } } }, }); // メイン処理 phina.main(function() { // アプリケーション生成 var app = GameApp({ startLabel: 'main', // メインシーンから開始する }); // アプリケーション実行 app.run(); });
実行するとこんな感じ
今までは自分で全部書いて実装していたので、ものすごく便利になりました。
Diggerクラスでダンジョン生成をし、map.create関数でマップ情報を配列に書き出してくれます。
rot.jsではダンジョン生成だけでなく、最短距離探索やターン制の実装などが出来る機能もあるらしいので今後使って行こうと思います。
ただ、日本語のチュートリアルがないので使えるようになるまでに時間が掛かるかもしれない。
一通り使えるようになったら、このブログにチュートリアル記事を書こうと思います。