Javascript 游戏中关卡的数据结构

我正在使用完全基于平铺的

canvas

用JavaScript创建一个平台游戏。存储游戏中物品块（墙壁、地板、物品）的最佳方法是什么？问题是每一块瓷砖都可以被破坏或创造

目前我有一个2D阵列，因此我能够快速检查项目是否位于特定的X&Y位置。问题是当用户移动并且地图需要滚动时，我需要重新分配每个块。当项目位于

x=0

时会发生什么情况？我不能使用负索引

我宁愿将滚动模拟一次切换到一块瓷砖上。此外，我还计划在用户移动时随机生成地图，如果以前没有生成过的话。因此，一旦产生了某种东西，它应该永远保持这种状态

---

我要提到的另一点是，它也将是多人游戏。因此，在缓存数据变脏并需要从数据库获取最新数据之前，对屏幕进行分块是一个好主意。唉，我对这一切都是陌生的；似乎不可能，非常感谢任何帮助。

显然有很多方法可以做到这一点

如果它们的级别不太大，则可以保留2d阵列的原始设计，并使用变量存储当前x/y滚动位置。这意味着您始终将所有地图信息存储在内存中，并且只访问需要在屏幕上显示的部分

绘制时，您可以计算出在当前滚动位置x/y可见的瓷砖，以及屏幕上适合当前屏幕宽度的瓷砖数量，并仅绘制所需的瓷砖

---

如果你一次滚动整个瓦片，那就很容易了。如果是模拟滚动，则需要更精细的控制，以确定开始绘制平铺的位置，或者可以将整个平铺集绘制到内存位图中，然后以负偏移量将其显示到绘图画布上。

由于您有无限级别，我建议使用与您已有的结构类似的结构，稍微调整一下

当用户接近当前块的边缘时，处理屏幕外的块，将所有块向左移动，然后把新的装进缺口里

希望这是清楚的，但以防万一，这里有一个图表：

带字母的方块是地图的大块，红色方块是视口（我画得太大了一点，记住视口比黑色方块小）。当视口向右移动时，卸载块A、B和C，将所有其他块向左移动，并将新数据加载到最右侧的块中。由于区块的宽度是屏幕宽度的两倍，因此您有足够的时间让用户穿过屏幕生成/加载级别到这些区块中。如果用户在世界各地快速移动，您可以使用一组4x4块进行额外缓冲

以解决返回到以前的地图块的问题。有几种方法可以做到这一点：

• 当数据块不再使用时（或javascript中的任何等价物），将其写入硬盘
• 在内存中无限扩展块集。而不是一个区块数组，而是一个assosciative数组，它获取区块的x/y位置，并返回区块（或null，表示用户以前从未到过这里，您需要生成它）
• 按程序生成您的级别，这很复杂，但意味着一旦一个块离开屏幕，您就可以处理它，并且相信您以后可以重新生成完全相同的块

---

我曾经用XML和JSON定义过这个东西。。。我认为JSON序列化在JavaScript中使用会更快、更高效（更不用说更容易），特别是因为JSON非常适合于可变长度列表，就像您在每个游戏中需要“N”级别一样

使用标准格式还将使其更具可重用性，并且（理想情况下）鼓励更多的协作（如果这正是您想要的）。您可以查看我第一次尝试创建的

正如fileoffset所说，有很多方法可以做到这一点，但我强烈建议将级别数据（即概念）与渲染（即运动中的对象、路径、速度、计时、x/y/z坐标定位等）分开

---

同样，正如文章所说，该领域是变化最快的领域，而且不知道WebGL、SMIL+SVG、Canvas+Javascript、优秀的ol'Flash/Actionscript或其他什么东西是否是适合您的最佳途径，这取决于您的需要和您正在开发的游戏类型。

您的平台在x轴上是否无限宽？为什么x=0有问题？在这种情况下，你应该阻止左滚动吗？看看它是无限的。用户应该能够使用相同的磁贴返回左侧。