javascript - 如何加载各个方向的div

Question

我正在尝试主要使用带有 django 后端的 javascript 来构建游戏。理想情况下， map 会很大，所以我不想为用户加载整个 map ，而只是加载周围的 map 。 (类似于谷歌地图)如果一次全部加载，可能会有 10,000 多个 div。

我想制作一些相对于位置的背景 div，并加载具有绝对位置的 div。 Javascript 可以使用类似

的方式加载 block

在 JavaScript 中

var someX = -1000;
var someY = -500;

要加载的分区:

top: (someX + "px");
left: (someY + "px");

但我觉得计算每个 block 的偏移量会是一个巨大的困惑。

这行得通吗？它是跨浏览器的兼容解决方案吗？或者是否有更简单的解决方案可以加载类似于 Google map 的 map block ？

Answer 1

这取决于您如何定义“ block ”。大多数Tileset基于 - 的引擎通过固定大小(通常以像素为单位，但也可以是其他东西)的“图 block ”使它们自己更容易。所以你可以给一个函数“tile-count x,y”，它只是:

offsetX = tileNumberX x tilewidth  ;
offsetY = tileNumberY x tileHeight ;

提供更多灵 active 的那些通常为每个单独的图 block 集提供一个 json 或 xml 文件。这定义了每个图 block 的边界和偏移量。因此，您的函数只需要读取文件，您只需在开发周期中为每个 tileset 预先计算一次。

为了在开始编程之前进行试验，我可以真正推荐Tiled editor 的组合和 Superpowers engine .

它基本上可以准确地提供您所描述的内容，因此您可以决定按原样使用它。否则，它是一个很好的工具，可以用来试验您自己的引擎处理事情的不同方式。