网页三维地图技术初探

根据是否需要加载地图服务器中的资源将网页三维地图技术分为两大类:

一、需要服务器配合的

1、cesiumjs
    许可证:Apache 2.0 license
    可以在调整经纬度,但是不能调整人眼的视角,也就是地球的轴线不能在显示器的平面中旋转。
优点:可以绘制三维数据,圆柱圆锥、卫星







2、openwebglobe
许可证:Open source licenced under MIT


3、d3cesium
是cesium中的一个示例,在d3中也有这个示例。
许可证:Cesium is open source under the Apache 2.0 license. It is free for commercial and non-commercial use.
缺点:画 的柱子三维化不够,只能两个方向旋转
优点:页面右侧的功能选项按钮可以可以加载不同的地图样式,也可以选择地图的展示方式(平面、球体、斜视)




二、不需要服务器配合

1、webglearth
许可证: GPLv3 license
要加载在线地图资源,有教程和说明。
The easiest way how to embed a 3D globe in any webpage. Simple but still very powerful API. No plugin needed.



2、jquery.earth-3d
许可证:jquery.earth3d.js is, as the sphere.js plugin, under MIT licence.
缺点:只能在一个方向旋转,地球是一个canvas图层、飞机的航线又是另一个canvas图层


3-1、d3 globe
许可证:Library released under BSD license
参考d3示例中的Faux-3d Shaded Globe。
优点:可以二维旋转,三维显示,使用 d3js的技术,加载文字、改变区域的颜色较好控制。
缺点:画三维的柱子较困难

    本人做的效果如下图:
    
    已经可以做到离线版,加载的是world-110m.json这个解析力的地图
    可以实现平面内左右前后旋转(但是有一定的限制),但是不能旋转地球轴线方向
    可以加载各个国家的首都、主要城市,并在地图上加以文字(中英文)标注。

3-2、d3 Faux-3D Arcs
网址:http://bl.ocks.org/dwtkns/4973620
许可证:Library released under BSD license

可以画点到点之间的连线图


4、planetaryjs

        网址:http://planetaryjs.com/
      许可证:100% free and open source, licensed under the MIT license
        利用了d3.js 、  Moment.js等技术
        它比d3 globe 更进一步,截至目前里面有三个实例,其中第三个实例除了加载显示三维地图外,
        还可以加载地震数据,这个数据是随时间变化而加载的

    

5  、 chromeexperiments


简介:The WebGL Globe is an open platform for geographic data visualization. We encourage you to copy the code, add your own data, and create your own.

特点:
Latitude / longitude data spikes
Color gradients, based on data value or type
Mouse wheel to zoom
More features are under development...

    大多数的示例都是加载经纬度高度等的数据



备注 :
1、地图数据获取来源:http://www.naturalearthdata.com/
2、查看在线卫星数据(对地球表面拍照的照片)http://science.nasa.gov/


网页三维地图技术初探,古老的榕树,5-wow.com

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。