0

はるかに大きなマップから 3x3 ミニマップ チャンクを使用して、チャンク タイルマップ システムを構築しています。この時点で、チャンクを操作できましたが、オブジェクトの元の x/y に対して相対的に塗りつぶすように、タイル クラス内でタイルをオフセットする方法がよくわかりません。現在、ネストされた for ループで反復されますが、各オブジェクトの左上隅にある 1 つのタイルのみが表示されます。これは私が現在持っているものです：

(function() {

var tile = function(array, _x, _y, spritesheet) {
  this.initialize(array, _x, _y, spritesheet);
}
tile.prototype = new createjs.Container();

tile.prototype.Container_initialize = this.initialize;
tile.prototype.initialize = function(array, _x, _y, spritesheet) {

    this.x = _x * 120;
    this.y = _y * 120;

    this.tileArray = array; 

    this.tilesheet = spritesheet;

    this.i = 0;

    for (this.x = 0; this.x < 3; this.x++)
    {
        for (this.y = 0; this.y < 3; this.y++)
        {
            var tileSprite = new createjs.Sprite(this.tilesheet, this.tileArray[this.x][this.y]);
            tileSprite.x = this.x; 
            tileSprite.y = this.y;


            this.addChild(tileSprite);



            this.i++;
        }       
    }
}

window.tile = tile;
}());

1 つだけでなく 9 つのタイルすべてが引き出されるように、オフセットを適切に修正する方法について誰かが提案できますか?

4

1 に答える 1

1

グリッドをレイアウトするためのより良いアプローチは、配置のための計算で 1 回の反復を行うことです。

ここにいくつかの疑似コードがあります（テストされていませんが、必要なもののアイデアが得られるはずです）

var cols = 3;
var rows = 3;
for (var i = 0; i<rows*cols; i++) {

    // Determine the row & column using simple math
    var row = Math.floor(i/cols);
    var col = i%cols;

    // Create the item
    var tileSprite = new createjs.Sprite(this.tilesheet, this.tileArray[row][col]);
    // Note there is probably a better way to determine the item you want, you can probably
    // use the "i" variable instead.
    var tileSprite = new createjs.Sprite(this.tilesheet, i);

    // Position it using width/height variables
    tileSprite.x = col * COL_WIDTH;
    tileSprite.y = row * ROW_HEIGHT;
    this.addChild(tileSprite);
}
于 2013-10-31T15:27:21.897 に答える