Question

我正在使用我自己的瓷砖bliting引擎，这个是使用六边形瓷砖 - 但我认为它与常规瓷砖没有太大区别。

我有巨大的x，y数组，他们有x，y坐标用于在画布上渲染，我只迭代在当前相机位置画布上可见的那些。

所以我坚持使用缩放并且无法自行解决这个问题。这是我在画布上绘制图块的代码：

public function draw():Void{
    clearCanvas(); //Clear canvas (bitmapData)
            var _m:Matrix;
            iterateTiles(function(_tile:HexTile):Void{ // loop every tile that is visible on screen
                _m = new Matrix();
                _m.translate(_tile.x + cameraPoint.x,_tile.y  + cameraPoint.y);//Get pre calculated tile x,y and add camera x,y
                _m.scale(matrixScale, matrixScale);
                drawToCanvas(_tile,_m);//Send to draw tile on canvas using Matrix
            },true);
        }

这种方法效果很好而且速度很快，但唯一的问题是从左上角开始缩放瓷砖（就像常规尺度一样）

Before scale

After scale

我的问题是如何将瓷砖转换为始终从中心缩放。因此，如果在缩放之前tile 10:10位于屏幕的中心，那么它应该缩放后留在那里。

Answer 1

对不起，我误解了这个问题，但我想我现在已经知道了：

// Scale the distance from the original point to the center of the canvas
var xDistance:Number = ((_tile.x + cameraPoint.x) - xCenter) * matrixScale;
var yDistance:Number = ((_tile.y + cameraPoint.y) - yCenter) * matrixScale;

// Add the distances to the center of the canvas. This is where you want the tile 
// to appear.
var x:Number = xCenter + xDistance;
var y:Number = yCenter + yDistance;

// Because the coordinate is going to be scaled, you need to increase it first.
x = (1 / matrixScale) * x;
y = (1 / matrixScale) * y;

_m.translate(x, y);

我没有测试过这个，我刚刚在方格纸上画出来了。如果有效，请告诉我。

缩放平铺网格

1 个答案: