現如今越來越多人關注可視化，可視化效果的展現不僅能幫助用戶更好的展示企業，還可以幫助員工更好的開展工作。作爲技術開發人員你一定很關心做可視化應用的開發用何種編程語言呢？說到編程語言，我們都知道其中幾種，例如php、Javascript 、java、python等等。thingjs平臺作爲物聯網可視化pass平臺，使用最熱門的Javascript，基於webgl標準，可以通過平臺的框架代碼、快捷代碼實現可視化應用的開發。建議開發人員嘗試一下哦~
縮放動畫.js
/**
* 說明：物體縮放動畫（scaleTo）
* 操作：點擊按鈕 控制相應物體縮放
* 教程：ThingJS教程——>控制對象——>位移/旋轉/縮放動畫
* 難度：★★☆☆☆
*/
var app = new THING.App({
url: 'https://www.thingjs.com/static/models/storehouse'
});
app.on('load', function () {
// 創建Box
var box = app.create({
type: 'Box',
width: 5.0, // 寬度
height: 5.0, // 高度
depth: 5.0, // 深度
center: 'Bottom', // 中心點
});
new THING.widget.Button('縮放Box', function () {
box.scaleTo({
scale: [1, 5, 1], // 縮放倍數
time: 1000, // 動畫時間
complete: function () {
console.log('縮放完成');
}
})
})
var car01 = app.query('car01')[0];
// 以 car 爲父物體 創建Marker
var marker = app.create({
type: "Marker",
offset: [0, 2, 0],
size: 4,
url: "https://thingjs.com/static/images/warning1.png",
parent: car01
});
new THING.widget.Button('縮放Marker', function () {
marker.scaleTo({
scale: [1.5, 1.5, 1.5], // 縮放倍數
time: 1000, // 動畫時間
loopType: THING.LoopType.PingPong // 循環類型 設置循環後 無回調函數
})
})
new THING.widget.Button('停止縮放Maker', function () {
marker.stopScaling();
})
});
