计算等距矩形网格中的列数和行数答案

【问题标题】：Calculating column and row number in an isometric rectangular shaped grid计算等距矩形网格中的列数和行数
【发布时间】：2011-07-01 07:15:24
【问题描述】：

我正在尝试扩展基于 as3isolib 的等距 Flash 游戏。该游戏仅支持菱形网格，但我也必须实现具有矩形网格的可能性。请看我的example grid。

我已经设法创建了网格。代码如下：

private function createRectangularGrid():void
{
    var c:int, r:int;
    var node:DataNode;
    var pt:Pt;
    var nodePos:Point;
    var isEvenRow:Boolean;

    for (c=0; c<cols; c++) {
        nodePos = new Point(c*_cellSize, -c*_cellSize);
        for (r=0; r<rows; r++) {
            node = new DataNode();
            node.col = c;
            node.row = r;
            node.x = nodePos.x;
            node.y = nodePos.y;
            node.z = z;
            node.width = _cellSize;
            node.length = _cellSize;
            node.height = 0;

            pt = new Pt(node.x, node.y, node.z);
            IsoMath.isoToScreen(pt);
            node.screenX = pt.x;
            node.screenY = pt.y;

            _nodes.set(c, r, node);

            isEvenRow = r % 2 == 0;
            if (isEvenRow) nodePos.x += _cellSize;
            else nodePos.y += _cellSize;
        }
    }
}

使用 20px 的单元格大小（等距宽度和长度），上面显示的网格单元格的等距位置是：

[DataNode (col:0, row:0, x:0, y:0)]
[DataNode (col:0, row:1, x:20, y:0)]
[DataNode (col:0, row:2, x:20, y:20)]
[DataNode (col:0, row:3, x:40, y:20)]
[DataNode (col:0, row:4, x:40, y:40)]
[DataNode (col:0, row:5, x:60, y:40)]
[DataNode (col:0, row:6, x:60, y:60)]
[DataNode (col:1, row:0, x:20, y:-20)]
[DataNode (col:1, row:0, x:20, y:-20)]
[DataNode (col:1, row:1, x:40, y:-20)]
[DataNode (col:1, row:2, x:40, y:0)]
[DataNode (col:1, row:3, x:60, y:0)]
[DataNode (col:1, row:4, x:60, y:20)]
[DataNode (col:1, row:5, x:80, y:20)]
[DataNode (col:1, row:6, x:80, y:40)]
[DataNode (col:2, row:0, x:40, y:-40)]
[DataNode (col:2, row:1, x:60, y:-40)]
[DataNode (col:2, row:2, x:60, y:-20)]
[DataNode (col:2, row:3, x:80, y:-20)]
[DataNode (col:2, row:4, x:80, y:0)]
[DataNode (col:2, row:5, x:100, y:0)]
[DataNode (col:2, row:6, x:100, y:20)]

问题是所有对象和头像仍然像网格一样被放置为菱形。这是因为基于等距 x/y 位置计算列数和行数的公式仅适用于菱形网格：

var isoPt:Pt = IsoMath.screenToIso(new Pt(avatar.x, avatar.y));
var col:uint = Math.floor(isoPt.x / CELLSIZE);
var row:uint = Math.floor(isoPt.y / CELLSIZE);

有人知道矩形网格的公式应该如何吗？

【问题讨论】：

标签： actionscript-3 isometric

【解决方案1】：

我想通了。以下方法将返回作为参数传递的位于等距 x/y 位置下方的图块的列号和行号。

public function getNodeByIsoPos(x:Number, y:Number):DataNode
{
    var c:uint, r:uint;
    if (_shape == STAGGERED_SHAPE) {
        // This calculates column and row for a rectangular map (also called staggered map or block map)
        c = Math.floor((Math.floor(x / _cellSize) - Math.floor(y / _cellSize)) / 2);
        r = Math.floor(x / _cellSize) + Math.floor(y / _cellSize);
    } else {
        // This calculates column and row for a diamond map
        c = Math.floor(x / _cellSize);
        r = Math.floor(y / _cellSize);
    }
    return getNode(c, r);
}

完美运行。如果有更优雅的方式，请告诉我。

【讨论】：