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 是完全可定制,包括颜色,旋转等等。
一些截图: