2d 到等距公式

Question

tileWidth 是 64，tileHeight 是 32。

这是我的地图数组：

var map:Array=
    [
        [2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2],
        [2,3,1,3,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,2],
        [2,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,2],
        [2,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,2],
        [2,2,2,2,2,2,2,2,2,2,3,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2]
    ];

这是它们的放置方式：

//place tiles
        for (var i:Number = 0; i < map.length; i++)
        {
            for (var j:Number = 0; j < map[i].length; j++)
            {
                placeTile(map[i][j],i,j);
            }
        }

//place the tile based on coordinates
    private function placeTile(id:uint,i:uint,j:uint)
    {
        var pos:Point=new Point();
        pos.x = i;
        pos.y = j;
        pos = twoDToIso(pos);

        tile = new MovieClip(atlas.getTextures(getTile(id)),20);
        tile.x = pos.x ;
        //tile.y = pos.y + (map.length/2)*tileHeight - tileHeight*4 ;//used to center
        tile.y = pos.y;
        tile.addEventListener(TouchEvent.TOUCH, mapDown);
        mapContainer.addChild(tile);
    }

这是用于将二维点绘制成等距的函数：

//CONVERT POINT TO ISOMETRIC
    private function twoDToIso(pt:Point):Point
    {
        trace(" ");
        trace("twoDtoIso:");
        trace("2d: " + pt);
        var tempPt:Point = new Point(0,0);

        tempPt.x = (pt.x * tileWidth / 2) + (pt.y * tileWidth / 2);
        tempPt.y =  (pt.y * tileHeight / 2) - (pt.x * tileHeight / 2);


        trace("iso: " + tempPt);
        return (tempPt);
    }

我可以使用什么公式将单击图块时收到的坐标恢复为二维/访问地图数组？

Answer 1

从屏幕坐标到等轴测坐标的转换是您自己的倒数twoDToIso：对于 x 轴上的每 2 个像素，您从 y 轴上减去 1，因此相反，您对整个屏幕上的像素执行相同的操作y 轴。 （希望和我想的一样清楚。）

但是，计算的符号取决于地图的设置方式：x 轴对角线向上向右，或向下向右（并且，可能对 y 也是如此）。我用对角线向上图进行了测试，y 计数到右下角：

             +x
          ..
       2,0   ..
   1,0   2,1    ..
0,0   1,1   2,2    ..
   0,1   1,2   ..
      0,2   ..
         ..+y

如果您的地图以不同的方式绘制，请交换 x,y 计算的符号（也可能为常数 32）。

鼠标坐标mx,my到等轴坐标tilex,tiley的转换如下：

int tilex = mx - 2*my + 32;
int tiley = mx + 2*my - 32;

tilex /= 64;
tiley /= 64;

drawcursor (tilex, tiley);

对于 128x64 的图块来说是完美的像素：

将鼠标光标向下移动一个像素将选择蓝色所选图块右侧和下方的空白区域。

这里有一个小奇怪：我的图像下半部分的黑色空间是“负 x”，当输入它时，光标需要进一步调整 +1 以用于等距 x 位置。这是因为在 C^[*] 中，默认情况下，整数会“朝零”四舍五入。使用浮点数和floor 使它工作；但一般来说，您应该努力使用整数来进行诸如此类的频繁计算。 （另外，我认为负的 x 或 y 位置在常规瓦片地图中无效。）

^[*] 我用 C 和 SDL 编写了我的测试程序。

如果您希望能够在每个图块内选择单个像素（例如，如果您想选择图块的某个四分之一），您可以使用tilex 的小数部分和tiley：

innerx = tilex & 63;
innery = tiley & 63;

在除以 64 之前。