你期待的UTF-Grid——瓦片地图的前世今生

本周GeoHey数据可视化服务又添新功能——UTF-Grid帮你制作交互地图。
GeoHey能实现这一功能也是站在了巨人的肩膀上,想了解关于UTF-Grid的种种,还是先回顾一下瓦片地图的前世今生。

从古巴比伦黏土地图到今天的电子地图,从哥伦布航海图到现代化的卫星导航,地图的历史凝聚着人类的好奇和智慧,也掺杂着血腥和欲望。地图的历史足够厚重,因为地图关联着政治、军事、经济的沉浮;地图的历史也足够精彩,因为地图是为满足需求,伴随科学和技术的发展而发展起来的。

相当长一段时间内,地图都是小部分人的游戏。军事家用地图指挥战役;航海家用地图指引方向;国家用地图标记领地... 直到计算机技术普及,地图技术开始服务于更多的领域。但始终是,专业的人,在专业领域,做着与地图有关的专业的事。直到瓦片地图的诞生。

瓦片地图的诞生

地图数据通常体量较大,需要充足的带宽和数据渲染能力。瓦片地图诞生以前,地图多在局域网的桌面软件中使用。互联网的发展,催生了通过浏览器使用地图的需求,于是在1999年,出现了WMS(Web Map Service)这样的解决方案。在浏览器这一端,没有地图的概念,但浏览器天生就是为了显示文本和图片。WMS的设计是,在服务器端把地图渲染成图片,浏览器端显示地图图片。地图图片大小根据浏览器视窗大小来定。

WMS大大推进了互联网地图的进程。问题是,WMS根据浏览器视窗大小每次生成一大张图片,对于后端渲染和网络传输都是挑战,效率低下。紧接着就有了WMS-C(Cached)的思想,通过缓存地图瓦片提高效率。在工程实践方面更胜一筹的Google成为这一思想的最佳实践者。2005年,Google地图上线,通过高效的瓦片地图技术,让全球用户轻而易举的享受到了地图的福利。Google地图采用的Web Mecator投影和瓦片分级切割方案,也成为目前互联网地图事实上的标准。紧接着,Google地图又新增了路网服务、实时路况、街景地图和Google地球,互联网地图的蓬勃发展就此开始。

瓦片地图的原理

使用互联网地图时,我们看到的是一张铺满整个屏幕的大的地图图片。实际上,这张大的图片是多个尺寸相同(通常是256*256像素)的小图片按照既定规则无缝拼接而成的,这些小图片就是瓦片。瓦片按照如下图所示的金字塔结构组织,每张瓦片都可通过级别、行列号唯一标记。在平移地图、缩放地图时,浏览器根据金字塔规则,计算出所需的瓦片,从瓦片服务器获取并拼接。

由于瓦片是静态的图片,可预先生成,通过缓存和CDN技术,瓦片服务器可提供高效的瓦片读取服务。此外,浏览器并行获取和显示多张小图片,比获取和显示一张大图片要高效的多。显示地图变成和显示图片一样简单,这也是互联网地图能够承载亿级规模用户的原因。

瓦片地图的进化

以图片为介质的瓦片(栅格瓦片)打开了互联网地图的大门,互联网地图得以迅速普及。但是,随着地图的移动化和应用的逐渐深入,栅格瓦片至少遇到了两个问题:

  • 图片占用带宽和存储都较大,不利于地图在移动设备的应用;
  • 图片无法交互。

受网络带宽开销和存储空间的限制,栅格瓦片地图在移动端一开始就显现出先天不足。这促使在移动端,使用矢量瓦片替代栅格瓦片。矢量瓦片采用和栅格瓦片相同的分级切割方案,所不同的是,瓦片数据以矢量形式存在。矢量瓦片体积小,可高度压缩,占用的存储空间比栅格瓦片要小上千倍。一方面减小网络带宽消耗,另一方面使地图离线成为可能。

目前,在浏览器端,矢量瓦片也在逐渐成为互联网地图的主流技术。但这并不是说栅格瓦片将退出历史舞台。互联网地图数据更新不频繁,单个瓦片内需要显示的地物数量和种类有限,矢量瓦片可预先生成,进行局部更新的代价也很小。矢量瓦片并不适合数据更新频繁,数据量大,渲染方式复杂多样的场景。

可交互的栅格瓦片

以地理大数据为目标的GeoHey,面对复杂多样且多变的用户数据,在一开始就选择依托服务器端能力处理空间数据。GeoHey数据可视化服务,就是根据输入配置参数,把用户数据在服务器端渲染成图片。在很多应用场景中,需要查看空间数据的属性信息。由于栅格瓦片无法保留数据的空间特征,瓦片中的点、线、面失去了交互能力。那么,如何显示百万量级的地块数据,又能让地块具有交互能力呢?

在本周更新中,GeoHey数据可视化服务,增加了UTF-Grid能力,用以为栅格瓦片提供交互能力。UTF-Grid为何物?我们下次分解。先来体验下UTF-Grid开来的神奇力量吧!

[鼠标在地图上随意移动即可 全屏体验]

另,欢迎加入GeoHey技术支持QQ群:164183186

欢迎从GeoHey获取地理和位置相关的数据、知识、服务

访问网站 http://geohey.com

联系我们 contact@geohey.com

长按关注公众号

评论正在加载...
Great! You've successfully subscribed.
Great! Next, complete checkout for full access.
Welcome back! You've successfully signed in.
Success! Your account is fully activated, you now have access to all content.
分享