用js的方式使用ThingJS！

ThingJS代碼創建步驟

ThingJS中是如何創建代碼去開發物聯網可視化項目的呢？ThingJS的核心是什么？寫代碼第一步應該是什么呢？作為一個可視化平台，ThingJS在線開發平台該如何去使用呢？

ThingJS作為一個webgl協議標准庫，使用的是前端JavaScript語法，這使得JavaScript中的絕大部分方法在ThingJS中都可以使用，比如循環判斷、function等等，這些在JavaScript中怎么寫的，在ThingJS中就怎么寫，所以說ThingJS是面向前端開發人員的3D js 庫，只要會JavaScript，就能非常迅速的入門，尤其是在JavaScript、java受眾很廣的情況下，大部分的成尋緣入門ThingJS也會更加輕松。這樣無論是讓前端工作人員直接學習ThingJS還是讓后端java人員來開發這個，都是極為方便的。

ThingJS核心對象APP

ThingJS的核心對象APP創建方法如下：

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/uearth/history/uearth.min.v1.7.7.2.js

具體引用方法如下：

// 加載地圖
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，用js去開發三維可視化場景！