Javascript：存储地图数据的最佳方式？答案

【问题标题】：Javascript: Best way to store map data?Javascript：存储地图数据的最佳方式？
【发布时间】：2014-06-20 09:31:09
【问题描述】：

我正在用 JavaScript 构建一个简单的基于图块的 2D 游戏，我想知道在客户端上存储地图数据的最佳方式。

在服务器上，我将地图存储在 64x64 块中，当玩家进入其当前 64x64 块的象限时，我将请求接下来的三组。

因此，我肯定需要将块拆分为四叉树，其中每个节点是地图的 1/4。

我想知道如何在四叉树中存储每个象限。我最关心的是我能多快解析数据。当我请求一张新的 64x64 地图时，我需要在玩家能够看到它之前准备好它。如果我将地图数据存储为二维数组，则需要 O(N^2) 时间来存储它，我对此并不满意，尤其是因为我会做 3x 4096 个图块。是否有可能将其降低到 O(nlogn)？

如果有帮助，我会制作一个简单的游戏世界演示。目前，它只是将一个 64x64 块复制到一个二维数组中。 https://rawgit.com/Meredithrs/HTML5-Canvas/master/game-window-demo/index.html

【问题讨论】：

标签： javascript html canvas 2d tile

【解决方案1】：

据我了解

第一次优化

您可以尝试将允许的移动位置存储在仅用于主图块的一维数组中，而不是存储所有图块的位置。这将大大减少数据存储。

另一个优化

您还可以将视图分成四个象限。（如分而治之）

例如如果总维度为 [400,400]

像这样拆分

         - [0,0] - [ 200,200]
         -  [200,0] - [400, 200]
         -  [0, 200] - [200, 400]
         -  [200,200] - [400, 400]

然后在每个象限下创建四个允许位置坐标 [x,y] 的一维数组。

现在根据图块位置，选择哪个象限阵列。然后遍历它以查找是否允许移动。

优化还可以做得更多。祝你的项目好运:)

【讨论】：

我不会在地图数组中存储图元，所以我应该能够执行 map.get(x, y).isWalkable()，这不需要迭代，具体取决于我使用的数据结构。我更关心尽快将数据从字符串传输到数据结构。