我在学习的时候制作了这个小小的RPG红宝石游戏，现在我想把它变成一个浏览器游戏。我已经设置了Sinatra框架来服务它，所以我在寻找其他所有东西之前，是一种在浏览器中表示游戏地图的方法（位置属性存储在db中）。
当您滚动它时，地图不需要刷新或动态获取（至少在开发的这个阶段），但是，允许我将来这样做的技术将是选择它的一个很好的理由。
我想到的事情：html表格，html5画布，一些js框架正是为此设计的（我不知道=请建议）。
是的，我知道gamequery-js框架，但我从来没有使用它，我不知道它是否会减慢所有因素，因为我正在添加新功能（滚动，ajax）。< / p>
我真的不知道其他任何选择..也许有更轻的方法？更简单或更简约的方式？更有针对性的js框架，这是工作的正确工具？也许只是一些html画布代码，甚至是简单的图像映射，或者具有绝对定位的图像就足够了？
问题是我想从简单开始，然后逐渐变得更好，所以，正如我之前所说的，我更喜欢能给我提升空间的东西，或者更倾向于新的网络倾向但是也让我在开始时有点满足：）
所以......需要建议！并赞赏！ :) 感谢
P.S。 Flash被排除在外，因为我不喜欢它。
编辑：添加更多技术细节以更好地描述地图，因为charlietfl评论它过于含糊，无法给出一个好的答案：
在游戏开始时，每个新游戏的代码随机生成新地图。 现在忘了db，让我们说地图（比如100x100“square”）存储为三维数组。 （x，y，...） 阵列存储的最后“维度”＆amp;那个地图单元是什么：一个玩家，一个建筑物，等等。 所以我要做的就是将这些“正方形”或数组单元格渲染到浏览器中的二维平铺地图。 希望能更好地解释它！
答案 0 :(得分：1)
尝试KineticJS，http://kineticjs.com/ 根据其网站，
KineticJS是一个HTML5 Canvas JavaScript框架，它扩展了2d 通过为桌面和桌面启用高性能事件检测的上下文 移动应用程序。
您可以在舞台上绘制内容然后向其添加事件侦听器， 移动它们，缩放它们，并独立于其他形状旋转它们 支持高性能动画和过渡。
要了解kinetic js，请查看http://www.html5canvastutorials.com/ 希望这会有所帮助。
答案 1 :(得分：1)
根据地形的外观，最简单的可能只是绝对定位的图像。如果您的地图具有标准的平铺背景，则此功能尤其有效。您可以使用纯CSS来渲染背景，然后在必要时放置terrain元素。
如果您想要想象，您还可以通过将世界坐标转换为HTML坐标来模拟等距投影，其功能是沿y轴移动x坐标。实际上，对于聪明的精灵和地图设计来说，这甚至都不是必需的。