在Javascript和EaselJS中使用3x3数组时，偏移分块瓷砖贴图的最佳方法是什么？

我正在构建一个分块的tilemap系统，使用大得多的地图中的3x3小地图块。此时，我已经使用了块，但我不太清楚如何在tile类中偏移tile，以便它相对于对象的原始x/y填充它们。它当前使用嵌套的for循环进行迭代，但仅在每个对象的左上角显示一个平铺。这就是我目前拥有的：

(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;
}());

（函数（）{
var tile=函数（数组、_x、_y、精灵表）{
初始化（数组、_x、_y、精灵表）；
}
tile.prototype=new createjs.Container（）；
tile.prototype.Container_initialize=this.initialize；
tile.prototype.initialize=函数（数组、_x、_y、精灵表）{
这个.x=x*120；
this.y=_y*120；
this.tilerray=数组；
this.tilesheet=精灵表；
这个。i=0；
对于（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=此.x；
tileSprite.y=这个.y；
这个.addChild（tileSprite）；
这个.i++；
}       
}
}
window.tile=tile；
}());

---

有谁能提供一个建议，说明如何正确地固定偏移，以便绘制所有九个瓷砖，而不仅仅是一个瓷砖？

布置网格的更好方法是进行一次迭代，并使用一些数学进行放置

下面是一些伪代码（未经测试，但应能让您了解所需内容）

var-cols=3；
var行=3；
对于（var i=0；首先，您使用x和y作为迭代变量。如果我没有弄错的话，您最好使用其他变量，因为您使用x和y来放置瓷砖。绝对更快！虽然总体上加载顺序仍然错误，但这是一个完全独特的问题。
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);
}