ThingJS demo展示：3D场景轻松切换
ThingJS 3D开发框架不仅易学而且很适合屏幕展示，具有广阔的物联网发展前景。
使用ThingJS官方神奇模模搭来搭建场景，这个相信大家都很熟悉，它的场景能够自动同步到ThingJS网站中去，毕竟是一家亲，如果ThingJS在线平台找不到，那不是平台的问题，而是你的操作问题！记得回到模模搭客户端查看是否同步完全，或者是上传的obj模型因为标准或者规范的问题而被拒绝的，就可能导致场景无法正常同步，只要查看标准文档进行操作就可以啦！
物联网可视化项目主要涉及大型而复杂的园区、地理地形或者工程等，越复杂就越需要合理规划，ThingJS是如何简化这些开发流程的呢？我们是有神器助攻的！ThingJS经过多年开发经验的沉淀，得出了四个开发步骤：场景搭建、在线开发、数据对接、项目部署，同时把建模和开发分开，设计人员使用CampusBuilder（又称模模搭）或者cityBuilder搭建工具，无代码轻松拖拽元素即可制作模型，随后开发人员使用ThingJS在线开发，从官方示例了解最新的酷炫功能，基于JS代码轻松开发，不需要额外培训！
模模搭可以选择对应的模型搭建一个工厂或者是粮仓，但是特殊模型也有，可以从其他位置加载并上传使用，ThingJS推荐使用3DMAX工具搭建特殊模型，并提供3DMAX上传插件来完成传输，这些插件资源都可以在官网-资源中心下载。
在线开发的时候如何引用任何场景的URL？使用快捷键Ctrl+J或者直接点击园区icon打开园区界面，双击对应场景即可出现该场景的URL，引用完毕之后，参考如下官方示例进行不同的场景切换，一切清楚明白无保留！
如何在ThingJS开发平台进行一个场景的动态切换，有以下三步：
1、首先要有两个以上可以选择切换的场景，在模模搭场景搭建工具中进行建模
2、初始界面默认为第一个加载的场景，嵌入自由进出场景层级的功能
3、加入一个切换按钮，通过点击这个按钮，场景之间可以迅速切换，呈现淡入效果
因为物联网数字化转型，对于3D可视化的需求是空前的，为了满足这一需求，小步快步多次迭代是最好的策略，这里就少不了一款低成本又易用的工具支持。
代码示例如下：
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 |
/** * 说明：通过动态创建场景，实现场景切换 */
// 场景地址 var campusUrl = [ 'https://www.thingjs.com/static/models/storehouse', 'https://www.thingjs.com/./uploads/wechat/oLX7p0wh7Ct3Y4sowypU5zinmUKY/scene/ %E5%9B%BE%E4%B9%A6%E9%A6%86%E5%A4%96' ] // 存储创建完成的园区 var curCampus;
var app = new THING.App({ url: campusUrl[0] });
app.on('load', function (ev) { curCampus = ev.campus; app.level.change(curCampus);
new THING.widget.Button('场景切换', function () { var url = curCampus.url;
// 动态创建园区 if (url === campusUrl[0]) { createCampus(campusUrl[1]); } else { createCampus(campusUrl[0]); } }); }); function createCampus(url) { app.create({ type: "Campus", url: url, position: [0, 0, 0], visible: false, // 创建园区过程中隐藏园区 complete: function (ev) { // 新园区创建完成后删除之前的 curCampus.destroy(); // 将新园区赋给全局变量 curCampus = ev.object; // 创建完成后显示（渐现） curCampus.fadeIn(); app.level.change(curCampus); } }); } |
