用菱形瓷砖改变鼠标位置的数学基础是什么？

Question

我正在开发一个轴测(等距，但有一个角度的视图)的瓷砖游戏。

我的瓷砖系统工作得很好，现在我开始讨论输入问题。

瓷砖没有视觉匹配(未对齐/偏移钻石)与其背后的逻辑(数组)。

在我用"google-fu“找到的许多方法之间，将一个转换(”旋转“)应用于输入似乎是一种易于实现的转换(代码量方面)，而且性能也很好。

问题是，对于我所发现的所有来源，我无法真正理解数字来自何处，以及公式对它们做了什么。

所以，我想解释一下“仿射变换”的数学公式(如果这是它的名字，因为我不确定.)

@Yochai_Timmer对这个问题的回答是我想使用什么，但我不明白这些值是从哪里来的(主要是*)，也不知道对它们做了什么。

大部分*："28“是半块瓷砖的宽和全高，"14”是半高，"56“是全宽.也许.但这几乎是我从它得到的，所以不管正确与否，我还是被卡住了。

如果它能帮助您给我一个更清晰的答案，我自己的瓷砖就是80 width，我用相同的方法来应用(呈现)它们( 1x2y的右上角位于1x1y的中心，等等)

另外，我使用的是Java，API是Slick2D。因此，如果您知道任何隐藏的函数/类可以帮助公式的数学(例如：Math.sen()，Math.cos()，.)，或者一般情况下，您也可以指出它们，因为它可能对我有很大帮助。

Answer 1

转换背后的关键思想是将瓷砖看作经历了线性变换的普通矩形。为了理解这一点，假设你以一个正方形开始，就像下面这个：

  +-----+
  |     |
  |     |
  +-----+

考虑到这个正方形，您可以想到两个向量，它定义了"up“和"right”是什么意思，只取正方形的两边：

  +-----+     ^
  |     |     |
  |     |     |
  +-----+     +----->

让我们把这些矢量叫做i和j，你可以想象，通过旋转和倾斜，把这个方块转化成一个钻石。如果这样做，您可以考虑这两个向量i和j的情况：

   /\          ^
  /  \        /
 /    \      /
 \    /      \
  \  /        \
   \/          >

注意我和j是如何旋转和缩放的。

数学背后的诀窍是，在投影下确定一个点的平方值，就是试图逆转这一过程。不要从普通的i和j向量开始，以倾斜/旋转的向量结束，而是从倾斜/旋转的i和j向量开始，然后尝试在转换下将世界转换回一个很好的正方形网格。计算的方法是：“假设鼠标在投影中的位置(x，y)，如果我们取消这个转换，它会有什么坐标(x'，y')？”这背后的所有数学都是标准线性代数，可以在两个坐标空间之间进行转换。有关如何进行此操作的说明，请考虑阅读描述此过程如何工作的这篇维基百科关于转换矩阵的文章。

希望这能有所帮助！