日期:2014-05-16  浏览次数:20666 次

让一个页面内有一张无限大的图,怎么做呢?
就像网页游戏的场景地图或是谷歌地图,鼠标停留在上下左右的区域的时候,显示器内的图形就会一直跑,无边无际的跑,没有终点的跑。
我想用一张gif的小图(156*66mm)以平铺的方式达到上面的效果,能做到吗?
ps:
我认为内存当中应该有一个图形引擎,来生成这张无边无际的图,而不是从远方服务器调用图片。请高手指点。
------解决方案--------------------
肯定不会有"无限"图的. 只是用各种技术手段来达到这种效果.

不要小看谷歌地图, 仔细分析可以发现它是由几个很步骤来加载场景, 先是载入缩略图, 再根据区域编号去索引大图进行加载. 页游的地图也是会由若干小图不断地预加载, 在场景外拼接, 有时也会销毁已经显示过的图片来释放内存来达到你要的效果. "无限大"是很危险的
------解决方案--------------------
你被效果骗了,这效果看着方向感强
------解决方案--------------------
无限大的图。那的费多少内存啊
------解决方案--------------------
只要有(例如)256x256像素的一堆小图就行了。运行时拼成大图。当检测到背景画布中心位置移动了,那么就轮询一遍新位置下的各个小图应有的位置,凡是没有加载过<img>的位置就动态加入一个<img>,凡是四边都已经移除可见区域的<img>就动态移除它(以节省内存)。
------解决方案--------------------
就算是服务器端有所谓的“无限大图”,那么浏览器端也会用类似

    http://www.abc.com/maps?x=2&y=3

这类指令加载相对于大图的左上角“向右512像素、向下768像素”位置的一块256x256像素的小图。

这个时候,服务器可能就会从“大图”上切下(复制下)这一块小图,然后返回给浏览器端。

因此站在浏览器端的角度,如果你做出了一个“用小图无限拼接成大图”的简单框架,那么不管服务器端是有个“无限大的图”,还是有无限数量的小图,不管服务器端如何保存地图,都只是通讯协议而已。服务器端对客户端隐藏了地图的实现,只要响应这个通讯协议即可!