在thingjs中切换不同的园区或是3D城市场景

如何在thingjs中切换场景？

在thingjs中，如何一个项目切换两个甚至更多的场景呢？有时候物联网项目制作的场景不在同一个位置，一个项目会有多个场景，那么我们该如何去切换场景呢？别担心，thingjs中就有官方示例，告诉我们如何切换场景！

在切换场景之前，我们需要先在thingjs中制作好初始场景和要切换的场景，这里就以官方示例中的两个场景为例，使用thingjs园区搭建工具模模搭制作好的场景，将会自动同步到thingjs网站中去，如果thingjs网站中没有，那么我们得看看是不是场景还没有从我们的campusbuiler客户端中同步完全，或者其中有上传的obj模型不符合标准的，就有可能导致场景无法正常同步thingjs网站中。

在thingjs中引用该场景的URL，使用快捷键Ctrl + J 或者直接点击园区按钮来打开园区，双击对应场景即可出现该场景的URL，仿照thingjs中的官方示例，即可在thingjs中切换不同的场景啦~

/**

* 说明：通过动态创建场景，实现场景切换

*/

// 场景地址

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);

        }

    });

}