Thing JS notes

1. Create a scene

//  load ThingJS Sample Park 
var app = new THING.App({
    //  Scene address 
    url: 'https://www.thingjs.com/static/models/factory',  //  Scene address 
    //  The background color 
    background: '#000000',
    // 
    env: 'Seaside',
    //  The sky box 
    skybox： 'BlueSky',
});

2.  Loading the map

var app = new THING.App(); // 3D Scene initialization 

app.background = [0, 0, 0]; //  Set the background of the scene to black 

// Reference map component script 
THING.Utils.dynamicLoad(['https://www.thingjs.com/uearth/uearth.min.js'], function () {
    app.create({
        type: 'Map',
        //  Loaded map path 
        url: '',
        //  Initialize the completed function callback 
        complete: function (event) {
            console.log(event.object.userLayers.length);// The log window shows the number of map levels 
        }
    });
});

3. Create and destroy objects

var app = new THING.App({
    skyBox: "BlueSky",
}); // 3D Scene initialization , Set up sky box 

//  add to ThingJS Sample Park 
var campus1 = app.create({
    //  The type of object 
    type: "Campus",
    //  The path of the object resource 
    url: "models/factory",
    //  The position in the world coordinate system , The default location of the system is  [0, 0, 0]
    position: [0, 0, 0],
    id: 11,
    name: 'name',
    //  Callback after object loading 
    complete: function (ev) {
        console.log("Campus created: " + ev.object.id);
    }
});

// Add granary Park 
var campus2 = app.create({
    type: "Campus",
    url: "models/silohouse",
    position: [50, 0, -150],
    complete: function (ev) {
        console.log("Campus created: " + ev.object.id);
    }
});


//  Create multiple objects 


//  Create button , Click the button to destroy the object 
var button = new THING.widget.Button(' Destruction of objects ', function() {
       obj.destroy();
});

4. adopt load Event loading

app.on('load', function (ev) {
    // Get Park objects 
    var campus = ev.campus; 
})

5.  Query objects by attributes

app.on('load', function () {
    new THING.widget.Button(' Press id Inquire about ', queryById);
    new THING.widget.Button(' Query by object type ', queryByType);
});

//  Search for id by 2271 The object , Click the button to change the color of the object 
function queryById() {
    var car = app.query('#2271')[0];
    car.style.color = '#ff0000';
}
 //  The query object class is  Thing  The object of 
function queryByType() {
    var car = app.query(".Thing");
    car.style.color = '#ff0000';
}

6.  Father son attribute

app.on('load', function (ev) {
    // Get Park objects 
    var campus = ev.campus; 
    //  Access objects through the parent-child tree of the scene 
    var children = campus.children;

     for (var i = 0; i < children.length; i++) {
        console.log("children ", children[i])
    }
})

7.  Classification properties

app.on('load', function (ev) {
    //  Get Park objects 
    var campus = ev.campus;

    //  The log window displays the  Thing  object 
    campus.things.forEach(function (thing) {
        console.log('Thing: ' + thing.id);
    });
})