3D地球绘制
1.e-charts GL
ECharts 是一个使用 JavaScript 实现的开源可视化库,涵盖各行业图表,满足各种需求。echarts扩展插件ECharts GL,实现3d地球酷炫动画。
ECharts GL新增了三维的笛卡尔坐标系、地理坐标系,并且在这些新的三维坐标系基础上提供了六个新的系列类型,包括 散点图 scatter3D、折线图 line3D、柱状图 bar3D、曲面图 surface、飞线图 lines3D以及地图 map3D。
ECharts 遵循 Apache-2.0 开源协议,免费商用。
-
flights-gl
可用来展示全球供应链、物资运转、航班等信息,地球为平面 -
flights
可以只显示某个区域的航班,适合用来展示供应链、物资运转等,地球为3D形状 -
GL散点图
可用来展示全球各地区疫情人数分布等
其他详见官方示例
-
three.js(https://threejs.org/)
Three.js 是一款运行在浏览器中的 3D 引擎,你可以用它创建各种三维场景,包括了摄影机、光影、材质等各种对象。你可以在它的主页上看到许多精彩的演示。不过,这款引擎还处在比较不成熟的开发阶段,其不够丰富的 API 以及匮乏的文档增加了初学者的学习难度(尤其是文档的匮乏)three.js的代码托管在github上面。
使用three.js绘制3D地球,在网上看到大多数例子为使用地球贴纸,再通过绘制函数在地球上绘制轨迹。
个人觉得元素周期表这个demo的交互效果很好:
地址:
http://www.webgl3d.cn/threejs/examples/#css3d_periodictable -
Gio.js
Gio.js 是一个基于 Three.js 的 web 3D 地球数据可视化的开源组件库。使用 Gio.js 的网页应用开发者,可以快速地以申明的方式创建自定义的 Web3D 数据可视化模型,添加数据,并且将其作为一个组件整合到自己的应用中。 Github 地址: https://github.com/syt123450/giojs
中文官网: https://giojs.org/index_zh.html
Codepen 在线例子: https://codepen.io/collection/DkBobG/
特性:提供API,可以周期性地从一个数据源加载数据 -
Planetary.js (地址:http://planetaryjs.com/)
Planetary.js 是一个 JavaScript 库,用于构建互动球体效果。它使用 D3 和 TopoJSON 解析和渲染地理数据。Planetary.js 采用了基于插件的架构,即使是默认的功能是作为插件实现的,这使得 Planetary.js 非常灵活。Planetary.js 是完全可定制,包括颜色,旋转等等。
一些截图:
- cesium.js (https://cesium.com/blog/categories/userstories/)
官方地址:https://cesium.com/cesiumjs/
Cesium 是一款面向三维地球和地图的,世界级的JavaScript开源产品。它提供了基于JavaScript语言的开发包,方便用户快速搭建一款零插件的虚拟地球Web应用,并在性能,精度,渲染质量以及多平台,易用性上都有高质量的保证。
通过Cesium提供的JS API,可以实现以下功能:
- 全球级别的高精度的地形和影像服务
- 矢量以及模型数据
- 基于时态的数据可视化
- 多种场景模式(3D,2.5D以及2D场景)的支持,真正的二三维一体化
来自官方的一些截图:
优点:丰富的官方示例,详细的API开发文档