Question

在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.