基于区块的地图（网络浏览器游戏）的算法，如部落战争世界地图

Question

我正在尝试创建一个基于区块的世界地图，如部落战争或西方游戏。 我创建了一点但是当你用鼠标拖动地图时加载太慢了。

我的算法的工作原理如下：

---

页面加载：

• 通过JQuery的$ .post方法将切片从1加载到19（x1到y1和x2到y2）（我需要屏幕的宽度和高度为19 = 1900 / tile_width，因为我希望地图填满整个页）
• 将返回的数据（图块）附加到屏幕上（到目前为止一直很好）

---

在地图上拖动：

• 通过.post图块再次加载（根据您拖动的像素数量）
• 再次附加数据（屏幕上的图块）

---

如果你拖得很慢，一切都在工作，但如果你想像疯子一样拖动地图会变得一团糟（它不会加载所有的瓷砖）

如果可能的话，你能为我提供一个更好的算法，或者一些源代码（我在谷歌上没有发现这两个游戏的地图）

P.S。我试图将我的例子放在000webhost.com上，但我不知道为什么json_decode()返回null。我的电脑工作正常。

Answer 1

这只是一个普遍的想法 我无法为您提供源代码，但您应该做的很简单： 您不应每次移动鼠标时创建，追加，清除，重新附加，而应创建类似代码的“视口”。因此，所有图块都将被预设，然后在运行时，您将只打印视口上大于-MAP_TILE_SIZE且小于屏幕宽度+ MAP_TILE_SIZE的图块。

Answer 2

最后我创建了我想要的地图，并没有对每个拖动事件使用ajax请求。我只是将整个地图数据加载到javascript数组中。

这是预览（图片不是我的，所以我不建议使用它们）

这是github上的REPO