Php 设计最小地图：更有效的方法

我正在制作一个有小地图的wap游戏。它基本上是一个5x5 div，具有20x20像素的背景图像

不过，我在试图弄清楚如何设计它们时陷入了僵局

为每个“位置”制作一个100x100像素的图像不是一个好主意，因为如果其中一个20x20位置发生变化，我将不得不更新15个100x100图像

剩下两个选择：

• 使用GD将20x20像素图像组合成一个大的100x100像素图像
• 为小地图中的每个div提供20x20位置图像的背景

在第二个场景中，将发出大量HTTP请求来获取图像，在第一个场景中，将使用服务器资源将它们组合成一个大图像

---

你认为哪种选择更有效？基本上，我认为这是一种两败俱伤的情况，但我们必须决定哪种损失更痛苦。

为什么不看看CSS精灵呢

然后，您可以使用php函数生成映射，该函数随机选择CSS类（及其相对背景）

如果你有地图20x20的9个不同部分，要组合成一个3x3的网格，你只需要为每一张地图创建一个类。您可以通过友好方式生成它（将0px 0px替换为“$x=rand（0,3）*20；$y=rand=rand（0,3）*20；”左右

---

需要调用1个HTTP请求，GD中不会浪费任何服务器资源！

谢谢你的回答，我知道精灵是什么。但我仍然需要为它们生成100x100图像，所以我想这是最好的方法。至于不使用它们，一些地图div将有另一个角色的背景图像，然后是一些标签f或者项目图标。从技术上讲，我可以使用z-index，但很多移动浏览器都不支持它。

编辑

如果你建议将整个世界的地图作为精灵，想想看：大多数手机用户在未连接WiFi时有3-10 kB/s的下载速度，并且是按带宽收费的，而不是按时间收费的。这有很多想想看！通过图像优化，一张300x300像素的世界地图最大容量为20kb。即使是低速连接，要消耗大量带宽，你也应该加载大量页面。还有一个问题：你认为一个有基于带宽的计划和低速连接的人会玩你的游戏吗？我不是说这不值得rt，但想想你的目标，并为此优化游戏！好吧，有一款俄罗斯游戏也使用小地图（尽管每个div有单独的图像），实际上玩得非常活跃。：）至于加载很多页面，通常在一个会话中至少加载100个页面。我正在考虑让小地图成为可选的，或者有一个可选的低清晰度版本，只需使用CSS对字段进行相应的着色。你提到的俄罗斯游戏的名称是什么？：）哇，真酷！这是一个有趣的游戏概念。我不喜欢的是，你点击地图移动，它只是重新加载页面。我们确定这是最好的方法吗？如果你愿意，我真的很高兴和你谈谈这个项目。你有电子邮件或其他我可以私下联系你的东西吗？：）

.map1 {
    background-image:url(/images/css_sprite.png);
    background-position:0px 0px;
    background-size:20px 20px;
}