3

我在学习时制作了这个小 rpg ruby​​ 游戏，现在我想把它做成一个浏览器游戏。我已经设置了 Sinatra 框架来服务它，所以我首先要寻找的是一种在浏览器中表示游戏地图的方法（位置属性存储在 db 中）。

地图不需要在滚动时刷新或动态获取（至少在这个开发阶段），但是，让我在未来这样做的技术将是选择它的一个很好的理由。

我想到的东西：html表格，html5画布，一些正是为此目的设计的js框架（我不知道=请建议）。

是的，我知道 gamequery-js 框架，但我从未使用过它，而且我不知道当我添加新功能（滚动、ajax）时，它是否会减慢一切，导致无法使用。

我真的不知道任何其他选择..也许有更轻的方法？更简单或更简约的方式？更有针对性的 js 框架哪个是适合工作的工具？也许只是一些 html canvas 代码，甚至是简单的图像映射，或者具有绝对定位的图像就足够了？

问题是我想从简单开始，然后逐渐变得更好，所以，正如我之前所说，我更喜欢一些能给我改进空间或走向新的网络趋势但也会给我的东西一开始有点满足:)

所以..需要建议！并赞赏！：） 谢谢

ps Flash 被排除在外，因为我不喜欢它。

编辑：添加更多技术细节以更好地描述地图，因为 charlietfl 评论说它太模糊而无法给出一个好的答案：

在游戏开始时，每个新游戏的代码都会随机生成一张新地图。现在忘记db，假设一个地图（比如100x100“正方形”）被存储为一个三维数组。(x,y, ...) 数组的最后一个“维度”存储了地图单元格中的人物和内容：玩家、建筑物等。所以我所要做的就是将这些“正方形”或数组单元格渲染到浏览器中的二维平铺地图。希望能更好地解释它！

4

2 回答 2

1

根据您的地形看起来如何，最简单的可能只是绝对定位的图像。如果您的地图具有标准的平铺背景，这尤其适用。您可以只使用纯 CSS 来渲染背景，然后在必要时放置地形元素。

如果您想花哨，您还可以通过将您的世界坐标转换为 HTML 坐标来模拟等距投影，该函数使用沿 y 轴移动 x 坐标的函数。实际上，对于聪明的精灵和地图设计来说，这甚至都不是必需的。

于 2012-11-02T04:07:41.877 回答
1

试试 KineticJS，http ://kineticjs.com/ 根据其网站，

KineticJS 是一个 HTML5 Canvas JavaScript 框架，它通过为桌面和移动应用程序启用高性能事件检测来扩展 2d 上下文。

您可以在舞台上绘制事物，然后向它们添加事件侦听器、移动它们、缩放它们，以及独立于其他形状旋转它们以支持高性能动画和过渡。

要学习动力学 js，请查看http://www.html5canvastutorials.com/ 希望这会有所帮助。

于 2012-11-02T03:43:48.137 回答