微信号:infoqchina

介绍:有内容的技术社区媒体

全球地震系统的可视化

2014-06-17 10:55 邱俊涛

GIS(Geographic Information System) 在可视化方面,无疑是有很多优势的,相比于传统的表格或者图表,它更容易将读者快速的带入到具体场景中,并更好的理解图形背后的含义。


很多信息事实上都和地理位置有关,比如关键客户的分布图,货源/仓库在地理上的分布等,当这些信息以可视化的方式展现在地图上时,我们可以获得很多之前无法看到的信息,而这些信息可以帮助我们在未来做出更合理的决策。


本文将使用开源工具OpenLayers做一个实例,并在这个过程中详细讨论GIS背后的一些技术细节。在这个例子中,我们将会把地球上的地震统计信息用可视化的方式,直观的展现在地图上。

例子的最终运行结果如下:

图中的绿色点表示小于里氏3级的地震,红色的点表示大于里氏3级的地震。

Web GIS简介

Web GIS是将传统的GIS与Web集成起来,借助于Web的高可用性,Web GIS可以使地图服务本身更容易被人们获得。成熟的Web GIS产品已经有很多,比如Google Maps,Bing Maps等,这些GIS产品已经很早就深入了我们的日常生活,并为我们的学习工作带来了众多的便利,比如去一个陌生的城市出差时找到预定的酒店,查找离你目前所处位置最近的银行等等。


那么我们看到的网页上很漂亮的地图是怎么产生的呢?它们又是如何被渲染到页面上的呢?

地图的渲染方式

几乎所有我们看到的基于Web的地图,都是通过不同层次叠加出来的结果。GIS系统会将 河流,建筑物,街道,文本标签的信息分别存储与不同的层次上(物理上不同的文件/数据库中),这样做不但可以在编辑地图时更容易管理(比如表示街道的图层的更新频率肯定会高于表示河流的图层的更新频率 ),而且可以按需加载(只查看河流,街道,不要建筑物信息等),从而减少服务器上的负载。


地图服务器将不同的层次叠加,最终生成一张完整的地图。这个最终的地图包含了所有的信息,比如河流,建筑物等都会带上名称。而且每个层次都可以独立的配色,这样最终的地图就是我们见到的样子了:蓝色的水域,黄色的高速路,白色的建筑,绿色的公园等等。

图片来源(http://www.srh.noaa.gov/bmx/?n=gis)


地图在服务器端被渲染出来之后,尺寸一般会非常大。需要由专门的模块将这些大图切分成很多组的小图,这些小图被称之为瓦片(tile)。为了给不同缩放级别的客户端提供不同的图片,这些瓦片被精心的分成了多个组,每个组都有编号。如果地图支持18级的缩放,就会现有18个分组。当然分组好越靠后,分组中的瓦片越多。

服务器上的瓦片


而在客户端,当我们在Google Maps上拖动地图,或者放大某一个感兴趣的区域时,往往会看到一些灰色的块。这些灰色的块过几秒会被真实的地图替换掉。这是因为,我们不可能也不需要将GIS服务器上的地图完全加载到客户端呈现,而是分批获取。在获取地图瓦片的过程中,客户端会展现一些占位符,当真正的瓦片加载完成后,再完成替换。


比如当我们查看西安市地图时,前端的JavaScript脚本会根据缩放级别和目前浏览的区域发送少量的请求获取地图瓦片,然后再将这些瓦片拼成一副“完整”的地图。


更多精彩内容,请点击【阅读原文】

 
InfoQ 更多文章 Facebook如何实现PB级别数据库自动化备份 学术派Google软件工程师Matt Welsh谈移动开发趋势 Spotify为什么要使用一些“无聊”的技术? 妹纸们放假了,汉纸们做啥? 大多数重构可以避免
猜您喜欢 年终奖后,程序员的下一站是? 福利、福利、福利!重要事情要说三遍。 有一个利器,能帮你快速爬取你想要的一切…… 互联网圈怪现象:离职需要领号排队~ 谢谢,我的程序员父亲