[开源] Gio.js -- 一个基于 Three.js 的 Web3D 地球数据可视化库

BoYang 发布于2019-08-22 18:27 / 889人阅读

摘要：是一个基于的地球数据可视化的开源组件库。地址中文官网在线例子为什么要开发使用这个库的开发是受到大会上的项目世界武器贩卖可视化的启发，该项目开发者是员工。

在这里和大家分享一个和小伙伴们一起开发的开源库 Gio.js 。Gio.js 是一个基于 Three.js 的 web 3D 地球数据可视化的开源组件库。使用 Gio.js 的网页应用开发者，可以快速地以申明的方式创建自定义的 Web3D 数据可视化模型，添加数据，并且将其作为一个组件整合到自己的应用中。

Github 地址： https://github.com/syt123450/giojs

中文官网: http://giojs.org/index_zh.html

Codepen 在线例子: https://codepen.io/collection/DkBobG/

为什么要开发、使用 Gio.js

这个库的开发是受到 Google 2012 Info 大会上的项目世界武器贩卖可视化的启发，该项目开发者是 Google 员工 Michael Chang。使用 Gio.js 就可以快速构建这种炫酷的 3D 模型，并以此为基础进行深入地开发。Gio.js 具有以下的特点：

易用性 -- 仅使用 4 行 Javascript 即可创建 3D 地球数据可视化模型

定制化 -- 使用 Gio.js 提供的丰富的 API 来创建自定义样式的 3D 地球

现代化 -- 基于 Gio.js 构建高交互、跨平台、自适应的现代化 3D 前端应用

基本使用介绍

通过 NPM 或者 YARN 安装 giojs

    npm install giojs --save

    yarn add giojs

在 HTML 页面中添加了 Threejs 和 Giojs 依赖之后，您就可以基于 Giojs 开发您的应用了。我们将展示如何创建一个具有基础样式的 Gio 地球。

在页面中添加以下 Javascript 代码来初始化 Gio 地球：

文档

中文 README

快速了解如何使用 Giojs 开始使用文档

有关 Gio.js 的 3D基础组件介绍文档

详细介绍 API 文档

参与 Gio.js 项目开发的开发者文档

PS. 各位宝贵的 star 是对我们最大的鼓励与支持~

idc机房托管混合云基于webrtc的开源项目 three.js three.js极客 three.js教程

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/95879.html

产品三维模型在线预览

摘要：次时代传统的方式就是创建次时代模型，对应中的材质是高光网格材质对象，通常贴图文件包含颜色贴图法线贴图和高光贴图。产品在线展示案例预览玉镯在线预览：http://www.yanhuangxueyuan.co... 汽车在线预览：http://www.yanhuangxueyuan.co... Web3D技术历史可通过插件或WebGL技术实现Web3D，在线网页上预览操作三维...

DirtyMind 2019-08-23 12:08 评论0 收藏0
SegmentFault 技术周刊 Vol.35 - WebGL：打开网页看大片

摘要：在文末，我会附上一个可加载的模型方便学习中文艺术字渲染用原生可以很容易地绘制文字，但是原生提供的文字效果美化功能十分有限。 showImg(https://segmentfault.com/img/bVWYnb?w=900&h=385); WebGL 可以说是 HTML5 技术生态链中最为令人振奋的标准之一，它把 Web 带入了 3D 的时代。初识 WebGL 先通过几个使用 Web...

objc94 2019-08-21 17:08 评论0 收藏0
Room3D开发笔记0--序言

摘要：序言引子很多话想说作为前端开发者技术瓶颈生活压力必须要拓宽新的技术领域结合自身情况于是选择了。本质上是原生原生开发方式使用起来总是略显麻烦为了快速上手开发应用这里选择进行开发。技术栈源码准备使用方便维护扩展。序言 1、引子很多话想说,作为前端开发者,技术瓶颈、生活压力,必须要拓宽新的技术领域,结合自身情况,于是选择了WEBGL。 WEBGL 本质上是原生,原生开发方式使用起来总是略...

sevi_stuo 2019-08-23 17:17 评论0 收藏0