HTML5/JavaScript 2.5D——在自己的层面上开拓新天地

因此，我非常有兴趣启动一个模仿这种2.5D风格的HTML5/JavaScript项目：

我个人正试图远离第三方脚本，只保留代码的核心纯JavaScript。然而，我对trig的了解并不是最好的，那么解决这个问题最合适的方法是什么呢？我基本上想要一个用2D精灵制作的游戏，但是地平面（可能还有建筑，就像flash游戏中的一样）是倾斜的，以给它一种3D的感觉。我不想做一个“模式7”引擎（比如像马里奥卡丁车这样的SNES游戏），因为根据我的理解，它是分段的

---

有什么建议或资源需要我研究吗？

我只是想让你多了解一下，你知道，我试着做了这个，结果很好，但因为我的新工作，我停止了这个项目

无论如何，对于初学者，您可以查看一些用javascript编写的游戏引擎，以下是您可能会感兴趣的著名游戏引擎列表：

1-

2-

3-

你也可以查看这篇博文以了解更多信息

注意： 我知道你喜欢编写自己的Java脚本，相信我，这是一个非常好的习惯，但是我的建议是至少尝试一个Javascript游戏引擎（如果你可以尝试多个，那就好了），看看不同的引擎如何工作，以及它们如何在引擎罩下运行，我的朋友将激励您，并帮助您了解这些引擎，甚至可以制作您自己的引擎（这不是不可能的）

---

我并不是说你应该尽可能多地尝试（因为这显然是毫无意义的），但我告诉你要用你选择的引擎制作小型（如果可能的话很小）游戏，我的意思是要了解Javascript游戏引擎如何在2D中工作，然后使用WebGL技术移动到2.5D甚至3D。

我查看了你的参考游戏，并理解你所说的“2.5D”是什么意思。根据我的理解，解决这个问题的最佳方法是通过变换对象的x，y坐标来创建伪三维。你会有一个函数为你做转换，这里是我对一个例子的最好猜测

// This function takes in a x- and y-coordinates of an object corner and returns the
// coordinates of the corresponding back corner of an object.
var transform = function(x,y) {
  // The farther the character is from the object, the more skew there would be.
  // Here "char" is your globally recognized game character. If it was not in the scope
  // of the function you'd have to pass it as a parameter.
  var skew = (char.x > x) ? (char.x - x) : (x - char.x);
  var newx = (skew * 0.1); // obviously this would be variable depending on your liking

  // If the object corner is not on the ground (y == 0) then subtract from it's value,
  // otherwise add.
  var newy = (y > 0) ? (y - 10) : (y + 10);
};

在我的示例中，

10

是要更改y坐标的距离单位量。这就是你的示例游戏所做的。希望我的意见有帮助

---

里根

谢谢你，我一定会把这些引擎作为一种灵感来研究。这是我感兴趣的方向的一个良好开端。我简直不知从何说起，所以谢谢你。