如何添加3D场景，快速入门ThingJS 3D可视化？

如何让开发人员摆脱繁冗开发，进入快速启动和运行3D可视化项目？

ThingJS做为一款轻量化的PAAS平台，支持Ajax、JSONP、WebSocke等数据对接方式，产品组合包括场景搭建工具之模模搭、ThingJS开发平台、各种上传插件和在线/离线部署方式，贯穿3D可视化开发全流程，快速帮您建立商业可视化项目！

ThingJS启动后建立核心对象APP

ThingJS的核心对象APP建立方法以下：

1   var app = new THING.App();

加载园区场景

这个是核心对象的建立方法，具体还有加载园区的方式，经过URL的方式将园区加载至ThingJS中：

var app = new THING.App({

 url: "models/storehouse"

});

其中的URL则是咱们的场景地址，此处为选填，该地址可写绝对路径也可写相对路径。有人可能会疑惑这个地址怎么来的？只须要经过Ctrl + J 这个快捷键或者直接点击园区按钮，双击便可自动生成核心对象APP以及相关URL，图示以下：

固然也能够不输入路径，在你须要的时候经过 app.create建立园区物体，从而加载园区，代码示例以下：

var app = new THING.App();

var obj = app.create({

 type: "Campus",

 url: "models/storehouse/",

 complete: function() {

 console.log("Campus created: " + this.id);

 }

});

加载地球场景

除了园区的加载，地球的加载又是不一样的代码，可是使用起来是如出一辙的， 使用Ctrl + K 或者是直接点击地图按钮，双击地图便可引用对应场景，图示以下：

地图与园区在引用上还有些不一样，地球须要使用到此插件。

https://www.thingjs.com/ueart...

具体引用方法以下：

// 加载地图

var app = new THING.App();

// 设置app背景为黑色

app.background = \[0, 0, 0\];

// 引用地图组件脚本

THING.Utils.dynamicLoad(\['https://www.thingjs.com/uearth/history/uearth.min.v1.7.7.2.js'\], function () {

 app.create({

 type: 'Map',

 // 地图场景名：test

 url: 'https://www.thingjs.com/citybuilder\_console/mapProject/config/TkRBd01ERT1DaXR5QnVpbGRlckAyMDE5',

 complete: function (event) {

 console.log(event.object.userLayers.length);

 }

 });

});

其中URL则是咱们经过CityBuilder搭建的3D城市地图场景了，那么是否可以既显示园区场景又显示三维城市地图场景呢？这个是须要方法控制的，若是直接两个合在一块儿，须要用到ThingJS场景切换功能。

代码示例是很常见的，这是一个完整的助力于项目成果的官方例程，参考价值高。若是想快速入门ThingJS 3D可视化，欢迎加入ThingJS VIP会员，和咱们一块儿学习提高~