网页三维地图技术初探

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

一、需要服务器配合的

1、cesiumjs

   网址:http://www.cesiumjs.org

许可证:Apache 2.0 license

可以在调整经纬度,但是不能调整人眼的视角,也就是地球的轴线不能在显示器的平面中旋转。

优点:可以绘制三维数据,圆柱圆锥、卫星

2、openwebglobe

网址:http://www.openwebglobe.org/

许可证: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.

缺点:画 的柱子三维化不够,只能两个方向旋转

优点:页面右侧的功能选项按钮可以可以加载不同的地图样式,也可以选择地图的展示方式(平面、球体、斜视)

网址:http://cesiumjs.org/d3cesium/

二、不需要服务器配合

1、webglearth

网址:http://www.webglearth.org/

许可证: 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.

网址:http://sebastien.drouyer.com/jquery.earth-3d/

缺点:只能在一个方向旋转,地球是一个canvas图层、飞机的航线又是另一个canvas图层

3-1、d3 globe

许可证:Library released under BSD license

网址:http://bl.ocks.org/dwtkns/4686432

参考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

网址:    http://www.chromeexperiments.com/globe

简介: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...

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

http://www.chromeexperiments.com/detail/cloud-globe/这个只给了个介绍

备注 :

1、地图数据获取来源:http://www.naturalearthdata.com/

2、查看在线卫星数据(对地球表面拍照的照片)http://science.nasa.gov/

http://science.nasa.gov/iSat/?group=SMD

网页三维地图技术初探

时间: 2024-08-09 08:30:59

网页三维地图技术初探的相关文章

基于三维GIS技术的矢量地图动态LOD渲染方法研究现状

“地图是人类文化的杰作,它融科学.艺术于一体,作为描述.研究人类生存环境的一种信息载体是人类生产与生活中不可缺少的一种工具.”这是陈述彭院士为<中国地图学年鉴>作序的开场语.Taylor也曾指出“当涉及应用人脑来识别空间联系中的模式与相互关系时,地图学的认知方法是唯一的过程”.地图存在于我们生活的方方面面,应用广泛且己经产生了巨大的社会效应和经济效益,其重要性不言而喻.地图是地图可视化的结果,地图可视化作为现代地图学的核心一直是三维GIS的研究热点.地图可视化将电子设备的视觉传输能力和人类的视

借助WebGL三维可视化技术检索3D动态图像

大数据可视化平台是通过三维表现技术来表示复杂的信息,实现对海量数据的立体呈现.可视化技术借助人脑的视觉思维能力,通过挖掘数据之间重要的关联关系将若干关联性的可视化数据进行汇总处理,揭示数据中隐含的规律和发展趋势,从而提高数据的使用效率.在解决了海量数据分析耗时过长.挖掘深度不够.数据展现简单等问题的基础上,大数据可视化平台使人们不再局限于使用传统关系数据表来分析数据信息,而是以更直观的方式呈现和推导数据间的逻辑关系.总而言之,数据可视化是做大数据分析的一个很重要的手段.WebGL光栅化数据渲染引

三维图像技术与OpenGL基础理论

英文原文:3D Graphics with OpenGL Basic Theory 中文译文:三维图像技术与OpenGL基础理论 1. 计算机图像硬件 1.1 GPU(图像处理单元) 如今,计算机拥有用来专门做图像处理显示的GPU模块,拥有独立的图像处理储存(显存). 1.2 像素和画面 任何图像显示都是基于栅格的格式.一个栅格既是一张二维的像素直角坐标网.像素具有两个属性:颜色和位置.颜色通常使用RGB(红绿蓝)来表示,典型的有用8位或者24位二进制位(真彩色)表示一种颜色.位置则用坐标(x,

[原创.数据可视化系列之二]使用cesium三维地图展示美国全球军事基地分布

基于浏览器的三维地图还算是一个比较高冷的东西,最主要的技术难点是如何在浏览器上 多快好省 的显示三维数据,很遗憾,还真的没有太好的的方案,只能说还有可行的方案. 很久之前用过skyline,使用CS居多,也可以在浏览器使用actviex插件显示:另外就是arcgis globe,我没看到在项目中用的.后来google有一个globe,算是差的比较远. 一直到有一天,看到nokia的地图,没错,就是那个做手机的nokia,他们做的那个一个here.com 的地图,能够看三维地图,使用webgl在浏

基于三维GIS技术的公路交通数字孪生系统

交通运输系统是四个现代化建设的重要保障,在"一带一路"倡议规划背景下,互联网+.智慧交通提升到国家新战略.智慧交通的基石是建立可映射物理世界的虚拟世界,因此大多数交通管理平台项目通过抽象建模构造二维电子地图,并在抽象模型上集成数据及分析工具,实现运营期信息化管理.随着设计.施工.运营全生命周期细化管理日益增长的需求,传统的交通地理信息(Geographic Informa-tion System-Transportation,GIS-T)系统的压力也随之增加.交通基础设施数字化映射为三

基于Casperjs的网页抓取技术【抓取豆瓣信息网络爬虫实战示例】

CasperJS is a navigation scripting & testing utility for the PhantomJS (WebKit) and SlimerJS (Gecko) headless browsers, written in Javascript. PhantomJS是基于WebKit内核的headless browser SlimerJS则是基于Gecko内核的headless browser Headless browser: 无界面显示的浏览器,可以用于

瓦片地图技术总结

两个月以来,开始涉入WebGIS这块领域,发现GIS的东西确实挺多,每个方向需要研究的东西也很多,现把瓦片地图这一块的内容进行下总结.本文主要是对这个技术进行一个总体的介绍,目前,从事的是瓦片地图客户端方面的开发,后续会对其技术的具体实现做一个详细的介绍. 瓦片地图的定义 瓦片地图现状 瓦片地图设计涉及方向 瓦片地图定义: 瓦片地图:其实就是WebGIS中的一部分吧,我暂时这么理解,而且,应该是属于WebGIS中比较重要的一块.顾名思义,瓦片地图就是由一块块固定大小的“小图片”地图拼接而成的网络

张左峰的分享 网页游戏制作技术 加密的设计思路与手段

网页游戏制作技术 加密的设计思路与手段 必备工具:Doswf 好朋友Laan开发,请自行百度搜索 今天太晚了,明天再更新内容...咔咔咔

如何屏蔽SkylineGlobe提供的三维地图控件上的快捷键

SkyllineGlobe提供的 <OBJECT ID=" TerraExplorer3DWindow" CLASSID="CLSID:3a4f9192-65a8-11d5-85c1-0001023952c1" width=500 height=400></OBJECT>可以用来加载显示FLY格式的三维地图工程,可以嵌入到HTML页面中. 这个三维地图控件里,封装了在TerraExplorer中的一些快捷键,比如控制方向的"Q/W/