Gio.js
开始使用
Gio.js 2.0
基础元素
配置
功能设计型API
颜色风格类API
数据
回调函数
依赖库接口
高级功能
Gio.js Hello World
在HTML页面中添加了Threejs和Giojs依赖之后,您就可以基于Giojs开发您的应用了。我们将展示如何创建一个具有基础样式的Gio地球。
1. 创建一个 <div> 标签,您的Gio地球将会被渲染在这个标签中。
<div id="globeArea" style="width: 200px; height: 200px"></div>
2. 在您的页面中添加以下Javascript代码:
<script>
        $(function () {

                // 获得用来来承载您的IO地球的容器
                var container = document.getElementById( "globalArea" );

                // 创建Gio控制器
                var controller = new GIO.Controller( container );

                // 添加数据
                controller.addData( data );

                // 初始化并渲染地球
                controller.init();
        });
</script>
小贴士:我们在示例代码中使用了JQuery来让代码在页面加载完后执行。
3. 如果一切顺利,在浏览器中打开您的HTML页面你将会看到以下3D地球:点我
4. 试试codepen在线编辑:

See the Pen Giojs Hello World by syt123450 (@syt123450) on CodePen.