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

Question

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

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

为每个“位置”制作一个100x100像素的图像不是一个好主意，因为如果更改了这20x20位置之一，我将不得不更新15张100x100图像。

剩下两个选择：

• 使用GD将20x20像素的图像合并为100x100像素的大图像
• 给小地图中的每个div加上20x20位置图像的背景。

在第二种情况下，我会发出很多HTTP请求来获取图像，在第一种情况下，将使用服务器资源将它们组合成一个大图像。

您认为哪种选择更有效？ 基本上，我认为这是一种失败的情况，但是必须决定哪种损失不会那么痛苦。

Answer 1

您为什么不签出CSS SPRITES？

http://spriteme.org/

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

如果您假设将20x20地图的9个不同部分组合成3x3网格，则只需为每张地图创建一个类。 您可以动态生成它（用“ $ x = rand（0,3）* 20; $ y = rand = rand（0,3）* 20;”替换0px 0px左右）。

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

1个HTTP请求被调用，GD中没有服务器资源被浪费！