ibms-dome/Frontend/js/forge/modeltest.js
2023-01-09 17:26:15 +08:00

1459 lines
51 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

var viewer;
let fragProxy;
var targetFloorZ;
var elevatorSpeed;
var allDbIdsStr;
let bulbLight;//點燈
var spotLight;//聚光燈
let testLight;
var myDataList;//設備清單
var viewableData;
var dataVizExtn;
var spriteColorRed;
var levels;//剖面用
var light;
let pointLightHelper;
var tagIdDevList = [];//模型設備List: device_number、device_coordinate_3d、forge_dbid
var roomDataList = [];//模型房間List: room_id、room_name
function launchViewer(urn) {
var av = Autodesk.Viewing;
var options = {
env: 'AutodeskProduction',
getAccessToken: getForgeToken
};
Autodesk.Viewing.Initializer(options, () => {
viewer = new Autodesk.Viewing.GuiViewer3D(document.getElementById('forgeViewer'));
//viewer = new Autodesk.Viewing.Viewer3D(document.getElementById('forgeViewer'));//沒有工具列
viewer.start();
var documentId = 'urn:' + urn;
//加入熱點
viewer.addEventListener(av.GEOMETRY_LOADED_EVENT, addHotPoint, {
once: true,
});
Autodesk.Viewing.Document.load(documentId, onDocumentLoadSuccess, onDocumentLoadFailure);
});
}
function getAllLeafComponents(viewer, callback) {
var cbCount = 0;
var tree;
var jsData = []
function getLeafComponentsRec(current, parent) {
cbCount++;
if (tree.getChildCount(current) != 0) {
tree.enumNodeChildren(current, function (children) {
getLeafComponentsRec(children, current);
}, false);
}
var nodeName = viewer.model.getInstanceTree().getNodeName(current)
jsData.push({ id: current, parent: parent, text: nodeName })
if (--cbCount == 0) callback(jsData);
}
viewer.getObjectTree(function (objectTree) {
tree = objectTree;
var rootId = tree.getRootId()
var nodeName = viewer.model.getInstanceTree().getNodeName(rootId)
jsData.push({ id: rootId, parent: '#', text: nodeName })
var allLeafComponents = getLeafComponentsRec(rootId, '#');
});
}
function onDocumentLoadSuccess(doc) {
var viewables = doc.getRoot().getDefaultGeometry();
viewer.loadDocumentNode(doc, viewables).then(i => {
// documented loaded, any action?
});
viewer.addEventListener(Autodesk.Viewing.AGGREGATE_SELECTION_CHANGED_EVENT, (args) => {
var currSelection = viewer.getSelection();
var domElem = document.getElementById('id_printer');
domElem.innerText = currSelection[0];
/*var a = newLight();*/
//var color = new THREE.Vector4(255 / 255, 0, 0, 1);
//viewer.setThemingColor(751, color);
//var color = new THREE.Vector4(0, 1, 0, 1);
//viewer.setThemingColor(751, color);
//var dbid = currSelection[0]; //750;
//var it = NOP_VIEWER.model.getData().instanceTree;
//var indexinNames = it.nodeAccess.dbIdToIndex[dbid];
//var indexinStrings = it.nodeAccess.names[indexinNames];
//var nodeMainString = it.nodeAccess.strings[indexinStrings];
//var nodeSuffixString = it.nodeAccess.nameSuffixes[indexinStrings];
//var nodeFinalName = it.getNodeName(dbid);
//console.log("names: " + indexinNames + ", inStrings: " + indexinStrings + ", nodeMainString: " + nodeMainString + ", nodeSuffix: " + nodeSuffixString);
//console.log("nodeFinalName: " + nodeFinalName);
//var vp = viewer.impl.clientToViewport(event.canvasX, event.canvasY);
//var renderer = viewer.impl.renderer();
//var dbId = renderer.idAtPixel(vp.x, vp.y);
//if (dbId) {
// console.debug("Selected Id: " + dbId);
// //viewer.select(dbId);
// //viewer.impl.invalidate(true);
// viewer.model.getExternalIdMapping(data => console.log(data));
//}
//set color
//let nodeIdObj = 750;
//this.viewer.setThemingColor(nodeIdObj, red, this.model);
//const color = new THREE.Vector4(1.0, 0.0, 0.0, 0.5);
//viewer.setThemingColor(751, color, null, true);
var myDbid = currSelection;
//viewer.getProperties(myDbid, function (e) {
// //console.log('Entire object response ', e);
// //console.log('Properties ', e.properties);
// //foreach(item in e.properties) {
// // if (item.displayName == "【tag_id】") {
// // console.log(">> " + item.displayValue);
// // }
// //}
// e.properties.forEach(function (item) {
// //if (item.displayName == "【tag_id】") {
// // console.log(">> " + item.displayValue);
// //}
// if (item.displayName == "tag_id") {
// console.log(">> " + item.displayValue);
// }
// });
//});
});
//viewer.loadExtension('ToolbarExtension');
viewer.addEventListener(Autodesk.Viewing.GEOMETRY_LOADED_EVENT, function () {
var instanceTree = viewer.model.getData().instanceTree;
var domElem = document.getElementById('all_id');
allDbIdsStr = Object.keys(instanceTree.nodeAccess.dbIdToIndex);
domElem.innerText = allDbIdsStr;
//parseInt(allDbIdsStr[i]
//for (var i = 0; i < allDbIdsStr.length; i++) {
// //setTransparency(parseInt(allDbIdsStr[i]), 0.2);
// viewer.getProperties(parseInt(allDbIdsStr[i], function (e) {
// e.properties.forEach(function (item) {
// //if (item.displayName == "【tag_id】") {
// // console.log(">> " + item.displayValue);
// //}
// if (item.displayName == "tag_id") {
// console.log(">> " + item.displayValue);
// }
// });
// })
//}
//// ------------------ 取得tag_id底下的nodeId --------------------------------------
//var curDbId = 0;
////var tagId = 0;
////var _parentId = 0;
////var _childId = 0;
////var itemName = '';
////var childIdArr = new Array();
////let evelMap = new Map();
//let tree = viewer.model.getData().instanceTree;
//const model = viewer.model;
//const fragList = model.getFragmentList();
// //loadHeatmaps(model);
////allDbIdsStr.forEach((dbId) => {
//// curDbId = parseInt(dbId);
//// viewer.getProperties(curDbId, function (e) {
//// e.properties.forEach(function (item) {
//// if (item.displayName == "tag_id" && e.name == "【電梯】") {
//// //getFragmentWorldMatrixByNodeId(e.dbId, viewer);
//// //let fragProxy = viewer.impl.getFragmentProxy(viewer.model, frag);
//// tree.enumNodeFragments(e.dbId, function (frag) {
//// let fragProxy = viewer.impl.getFragmentProxy(viewer.model, frag);
//// let matrix = new THREE.Matrix4();
//// console.log("proxy: " + fragProxy.position);
//// fragProxy.getWorldMatrix(matrix);
//// });
//// tagId = e.dbId;
//// viewer.getProperties(tagId, function (e2) {
//// e2.properties.forEach(function (item2) {
//// if (item2.displayName == "child") {
//// _parentId = item2.displayValue;
//// viewer.getProperties(_parentId, function (e3) {
//// let itemMap = new Map();
//// e3.properties.forEach(function (item3) {
//// if (item3.displayName == "child") {
//// _childId = item3.displayValue;
//// childIdArr.push(_childId);
//// var n = 0;
//// viewer.getProperties(childIdArr[n], function (e5) {
//// e5.properties.forEach(function (item5) {
//// if (item5.displayName == "Name") {
//// itemName = item5.displayValue;
//// itemMap.set(childIdArr[0], itemName)
//// console.log("childIdArr[0] ", childIdArr[0])
//// console.log("item name: ", itemName);
//// n += 3;
//// }
//// });
//// })
//// n = 1;
//// viewer.getProperties(childIdArr[n], function (e6) {
//// e6.properties.forEach(function (item6) {
//// if (item6.displayName == "Name") {
//// itemName = item6.displayValue;
//// itemMap.set(childIdArr[1], itemName)
//// console.log("childIdArr[1] ", childIdArr[1])
//// console.log("item name: ", itemName);
//// n += 3;
//// }
//// });
//// })
//// n = 2;
//// viewer.getProperties(childIdArr[n], function (e7) {
//// e7.properties.forEach(function (item7) {
//// if (item7.displayName == "Name") {
//// itemName = item7.displayValue;
//// itemMap.set(childIdArr[2], itemName)
//// console.log("childIdArr[2] ", childIdArr[2])
//// console.log("item name: ", itemName);
//// n += 3;
//// }
//// });
//// })
//// }
//// });
//// evelMap.set(item.displayValue, itemMap)
//// })
//// }
//// });
//// })
//// }
//// });
//// })
////})
//allDbIdsStr.forEach((dbId) => {
// curDbId = parseInt(dbId);
// viewer.getProperties(curDbId, function (e) {
// e.properties.forEach(function (item) {
// if (item.displayName == "【tag_id】") { // Tag_name tag_id 【tag_id】
// if (item.displayValue != "") {
// if ((item.displayValue).indexOf('TPE_B1_LT_L1') > -1) {// TPE_B1_ME_M10
// console.log("--------------------------------------------------");
// console.log("Tag_name dbid: " + e.dbId);
// console.log("value: " + item.displayValue);
// }
// //var v = getFragmentWorldMatrixByNodeId(e.dbId, viewer);
// //console.log("v: " + v);
// //tree.enumNodeFragments(e.dbId, function (frag) {
// // fragProxy = viewer.impl.getFragmentProxy(viewer.model, frag);
// // fragProxy.getAnimTransform();
// // console.log("postion: " + fragProxy.position + ", fragP: " + fragProxy.fragPosition);
// //});
// let bounds = new THREE.Box3();
// instanceTree.enumNodeFragments(e.dbId, (fragId) => {
// let box = new THREE.Box3();
// fragList.getWorldBounds(fragId, box);
// bounds.union(box);
// }, true);
// var position = bounds.center();
// if ((item.displayValue).indexOf('TPE_B1_LT_L1') > -1) {
// console.log("position: (" + (position.x).toFixed(2) + ", " + (position.y).toFixed(2) + ", " + (position.z).toFixed(2) + ")");
// console.log("--------------------------------------------------");
// }
// }
// //getFragmentWorldMatrixByNodeId(e.dbId, viewer);
// //let fragProxy = viewer.impl.getFragmentProxy(viewer.model, frag);
// }
// });
// })
//})
////---------------------- end ---------------------------------------------------
// ------------------ 2023.01.06 取得tag_id、底下的nodeId --------------------------------------
var curDbId = 0;
let tree = viewer.model.getData().instanceTree;
const model = viewer.model;
const fragList = model.getFragmentList();
allDbIdsStr.forEach((dbId) => {
curDbId = parseInt(dbId);
viewer.getProperties(curDbId, function (e) {
e.properties.forEach(function (item) {
if (item.displayName == "【tag_id】") { // Tag_name tag_id 【tag_id】
if (item.displayValue != "") {
////if ((item.displayValue).indexOf('TPE_B1_LT_L1') > -1) {// TPE_B1_ME_M10
//console.log("--------------------------------------------------");
//console.log("Tag_name dbid: " + e.dbId);
//console.log("value: " + item.displayValue);
////}
var str = item.displayValue.split('_');
if (str.length == 2) { //兩段為房間 ex: U7F_01
roomDataList.push({ room_id: e.dbId, room_name: item.displayValue });
}
else if (str.length == 8) { //八段為設備 ex: TPE_B1_ME_M10_U7F_NA_FCU_N1
//取得座標
let bounds = new THREE.Box3();
instanceTree.enumNodeFragments(e.dbId, (fragId) => {
let box = new THREE.Box3();
fragList.getWorldBounds(fragId, box);
bounds.union(box);
}, true);
var position = bounds.center();
////if ((item.displayValue).indexOf('TPE_B1_LT_L1') > -1) {
//console.log("position: (" + (position.x).toFixed(2) + ", " + (position.y).toFixed(2) + ", " + (position.z).toFixed(2) + ")");
//console.log("--------------------------------------------------");
////}
tagIdDevList.push({ device_number: item.displayValue, device_coordinate_3d: '{ "x": ' + (position.x).toFixed(2) + ', "y": ' + (position.y).toFixed(2) + ', "z": ' + (position.z).toFixed(2) + ' }', forge_dbid: e.dbId });
}
}
}
});
})
})
//---------------------- end ---------------------------------------------------
//var curDbId = 0;
//var tagId = 0;
//var _parentId = 0;
//var _childId = 0;
////var childIdArr = new Array();
//let evelMap = new Map();
//allDbIdsStr.forEach((dbId) => {
// curDbId = parseInt(dbId);
// viewer.getProperties(curDbId, function (e) {
// e.properties.forEach(function (item) {
// if (item.displayName == "tag_id" && e.name == "【電梯】") {
// tagId = e.dbId;
// viewer.getProperties(tagId, function (e2) {
// e2.properties.forEach(function (item2) {
// if (item2.displayName == "child") {
// _parentId = item2.displayValue;
// viewer.getProperties(_parentId, function (e3) {
// var childIdArr = new Array();
// e3.properties.forEach(function (item3) {
// if (item3.displayName == "child") {
// _childId = item3.displayValue;
// childIdArr.push(_childId);
// }
// });
// evelMap.set(item.displayValue, childIdArr)
// console.log("map: " + evelMap);
// })
// }
// });
// })
// }
// });
// })
//})
// //let tree = viewer.model.getData().instanceTree;
//let nodeId = 12112;//12104; //749; //10952;
//let nodeId2 = 12111;//12105; //750;
//let nodeId3 = 12110;//12104; //751;
//tree.enumNodeFragments(nodeId, function (frag) {
// fragProxy = viewer.impl.getFragmentProxy(viewer.model, frag);
// fragProxy.getAnimTransform();
// let fragPosition = new THREE.Vector3(0, 0, 0);// 一樓0 二樓15 三樓 26
// fragProxy.position = fragPosition
// fragProxy.updateAnimTransform()
//});
//viewer.impl.sceneUpdated(true);
////------------ add -------------
//tree.enumNodeFragments(nodeId2, function (frag) {
// fragProxy = viewer.impl.getFragmentProxy(viewer.model, frag);
// fragProxy.getAnimTransform();
// let fragPosition = new THREE.Vector3(0, 0, 0);// 一樓0 二樓15 三樓 26
// fragProxy.position = fragPosition
// fragProxy.updateAnimTransform()
//});
//viewer.impl.sceneUpdated(true);
//tree.enumNodeFragments(nodeId3, function (frag) {
// fragProxy = viewer.impl.getFragmentProxy(viewer.model, frag);
// fragProxy.getAnimTransform();
// let fragPosition = new THREE.Vector3(0, 0, 0);// 一樓0 二樓15 三樓 26
// fragProxy.position = fragPosition
// fragProxy.updateAnimTransform()
//});
//viewer.impl.sceneUpdated(true);
});
//newLight();
//testLight = new THREE.SpotLight();
}
//------------------- 加入熱點 -----------------
async function addHotPoint(data) {
var viewer = data.target;
dataVizExtn = await viewer.loadExtension("Autodesk.DataVisualization");
const DataVizCore = Autodesk.DataVisualization.Core;
const viewableType = Autodesk.DataVisualization.Core.ViewableType.SPRITE;//DataVizCore.ViewableType.SPRITE;
const spriteColor = new THREE.Color(0xffff00); //0xffffff
spriteColorRed = new THREE.Color(0xff0000);
const spriteIcon = "https://d2zqnmauvnpnnm.cloudfront.net/assets-1/images/circle.svg"; //"/img/forge/hotspot.svg";
const style = new DataVizCore.ViewableStyle(viewableType, spriteColor, spriteIcon);
//var a = newLight();
newLight();
//function onSpriteClicked(event) {
// console.log(`Sprite clicked: ${event.dbId}`);
//}
//熱點 點擊事件註冊
viewer.addEventListener(DataVizCore.MOUSE_CLICK, onSpriteClicked);//MOUSE_CLICK SPRITE_SELECTED
//viewer.addEventListener(
// Autodesk.Viewing.SELECTION_CHANGED_EVENT,
// onSelectionChange
//);
viewableData = new DataVizCore.ViewableData();
viewableData.spriteSize = 24; // Sprites as points of size 24 x 24 pixels
//熱圖 打點 x: 0, y: 25.03, z: -2.52 三菱 43.72, -15.65, -44.96 // 43.72, -15.65, -44.96
myDataList = [{ position: { x: 43.72, y: -15.65, z: -44.96 } }, //-21.95, 8.92, 63.27 // -7.58, 18.20, -0.25
{ position: { x: 43.72, y: -15.65, z: -60 } },//-21.95, 7.61, 63.27
{ position: { x: -21.95, y: 6.43, z: 63.27 } },//-21.95, 6.43, 63.27
{ position: { x: -21.95, y: 5.31, z: 63.27 } }//-21.95, 5.31, 63.27
];// x: -17.33, y: 51.03, z: -2.52 ; x: -23.21, y: 51.03, z: -2.52
myDataList.forEach((myData, index) => {
const dbId = 10 + index;
const myPosition = myData.position;
const viewable = new DataVizCore.SpriteViewable(myPosition, style, dbId);
viewableData.addViewable(viewable);
});
await viewableData.finish();
dataVizExtn.addViewables(viewableData);
//---------------- 熱點點擊事件 --------------------
function onSpriteClicked(event) {
event.hasStopped = true;
if (event != undefined && event != null) {
if (event.dbId >= 10 && event.dbId <= 13) {//event.dbId > 0 && event.dbId < 19
setLightValues(20, 0x00ff00);
console.log(`Sprite clicked: ${event.dbId}`);
openHotspotModal();
}
if (event.clickInfo != null) {
//if (event.clickInfo.dbId == 12449) {
//const viewablesToUpdate = [event.dbId];
//dataVizExtn.invalidateViewables(viewablesToUpdate, (viewable) => {
// return {
// color: spriteColorRed,
// };
//});
//}
//document.getElementById('lbltipAddedComment').innerHTML .toFixed(2);
document.getElementById('deviceName').innerHTML = viewer.model.getInstanceTree().getNodeName(event.clickInfo.dbId);
document.getElementById('deviceDbid').innerHTML = event.clickInfo.dbId;
document.getElementById('devicePosition').innerHTML = "(" + (event.clickInfo.point.x).toFixed(2) + ", " + (event.clickInfo.point.y).toFixed(2) + ", " + (event.clickInfo.point.z).toFixed(2) + ")";
console.log(`event>> dbId: ${event.clickInfo.dbId}, id: ${event.clickInfo.object.id}, position.x: ${event.clickInfo.point.x}, y: ${event.clickInfo.point.y}, z: ${event.clickInfo.point.z}, name: ${viewer.model.getInstanceTree().getNodeName(event.clickInfo.dbId)}`);
}
}
}
//function onSpriteClickedOut(event) {
// //const dataVizExtn = await viewer.loadExtension("Autodesk.DataVisualization");
// event.hasStopped = true;
// const viewablesToUpdate = [event.dbId];
//dataVizExtn.invalidateViewables(viewablesToUpdate, (viewable) => {
// return {
// scale: 1.0, // Restore the viewable size
// //url: "https://.../circle.svg",
// };
//});
//}
//function onSpriteHovering(event) {
// const targetDbId = event.dbId;
// if (event != undefined && event != null && event.hovering) {
// if (targetDbId >= 10 && targetDbId <= 13) {//event.dbId > 0 && event.dbId < 19
// console.log(`Sprite clicked: ${event.dbId}`);
// openHotspotModal();
// }
// console.log(`The mouse hovers over ${targetDbId}`);
// } else {
// console.log(`The mouse hovers off ${targetDbId}`);
// }
//}
}
//------------------- end --------------
// 熱點 更換顏色
function changeColorForHotspot(dbId) {
//const viewablesToUpdate = [event.dbId];
const viewablesToUpdate = dbId;
dataVizExtn.invalidateViewables(viewablesToUpdate, (viewable) => {
return {
color: spriteColorRed,
};
});
}
////---------------- 熱點點擊事件 --------------------
//function onSpriteClicked(event) {
// //event.hasStopped = true;
// if (event != undefined && event != null) {
// if (event.dbId >= 10 && event.dbId <= 13) {//event.dbId > 0 && event.dbId < 19
// console.log(`Sprite clicked: ${event.dbId}`);
// //alert("I am an alert box! " + event.dbId);
// openHotspotModal();
// }
// if (event.clickInfo != null) {
// //document.getElementById('lbltipAddedComment').innerHTML .toFixed(2);
// document.getElementById('deviceName').innerHTML = viewer.model.getInstanceTree().getNodeName(event.clickInfo.dbId);
// document.getElementById('deviceDbid').innerHTML = event.clickInfo.dbId;
// document.getElementById('devicePosition').innerHTML = "(" + (event.clickInfo.point.x).toFixed(2) + ", " + (event.clickInfo.point.y).toFixed(2) + ", " + (event.clickInfo.point.z).toFixed(2) + ")";
// console.log(`event>> dbId: ${event.clickInfo.dbId}, id: ${event.clickInfo.object.id}, position.x: ${event.clickInfo.point.x}, y: ${event.clickInfo.point.y}, z: ${event.clickInfo.point.z}, name: ${viewer.model.getInstanceTree().getNodeName(event.clickInfo.dbId)}`);
// }
// }
//}
//function onSpriteClickedOut(event) {
// //const dataVizExtn = await viewer.loadExtension("Autodesk.DataVisualization");
// event.hasStopped = true;
// const viewablesToUpdate = [event.dbId];
// dataVizExtn.invalidateViewables(viewablesToUpdate, (viewable) => {
// return {
// scale: 1.0, // Restore the viewable size
// url: "https://.../circle.svg",
// };
// });
// // Continue with application logic that reacts to the deselection
// // event (e.g., update UI to a state where no selection is made).
//}
//function onSelectionChange(event) {
// if (event != undefined && event != null) {
// const dbIds = event.dbIdArray;
// if (dbIds.length > 0) {
// // 處理已選取元件的邏輯
// //openHotspotModal();
// console.log(`------ name: ${viewer.model.getInstanceTree().getNodeName(dbIds)} , dbId: ${dbIds}`);//, id: ${event.clickInfo.object.id}, position.x: ${event.clickInfo.point.x}, y: ${event.clickInfo.point.y}, z: ${event.clickInfo.point.z}
// } else {
// // 處理沒有選取元件的邏輯
// console.log("no item");
// }
// }
//}
//---------------- end -----------------------------
//----------------- 開關熱點小視窗 ----------------------
function openHotspotModal() {
var modal = document.getElementById("hotspotModal");
modal.style.display = "block";
$("#pills-register-tab").removeClass("active");
$("#pills-alarm-tab").removeClass("active");
$("#pills-operation-tab").removeClass("active");
$("#pills-login-tab").tab("show");
}
function closeHotspotModal() {
var modal = document.getElementById("hotspotModal");
modal.style.display = "none";
//dataVizExtn.removeAllViewables();
}
//------------------ end --------------------------------
//function getPosition(nodeId) {
function getFragmentWorldMatrixByNodeId(nodeId, viewer) {
let tree = viewer.model.getData().instanceTree;
let result = {
fragId: [],
matrix: [],
};
//let viewer = this.viewer;
tree.enumNodeFragments(nodeId, function (frag) {
let fragProxy = viewer.impl.getFragmentProxy(viewer.model, frag);
let matrix = new THREE.Matrix4();
fragProxy.getWorldMatrix(matrix);
result.fragId.push(frag);
result.matrix.push(matrix);
});
console.log("position: " + result);
return result;
}
//}
function setTransparentBuilding() {
//allDbIdsStr.forEach((dbId) => {
// setTransparency(dbId, 0.2);
//})
for (var i = 0; i < allDbIdsStr.length; i++) {
setTransparency(parseInt(allDbIdsStr[i]) , 0);
}
}
function recoverTransparentBuilding() {
//allDbIdsStr.forEach((dbId) => {
// setTransparency(dbId, 1);
//})
for (var i = 0; i < allDbIdsStr.length; i++) {
setTransparency(parseInt(allDbIdsStr[i]), 1);
}
}
//設定模型 透明度
function setTransparency(nodeId, opacity) {
var model = viewer.model;
//var nodeId = 1633;
var fragList = viewer.model.getFragmentList();
var fragIds = []
model.getData().instanceTree.enumNodeFragments(
nodeId, (fragId) => {
fragIds.push(fragId)
});
fragIds.forEach((fragId) => {
//获取材质
var material = fragList.getMaterial(fragId);
if (material) {
//设置透明度
material.opacity = opacity;//0.5;
material.transparent = true;
//标记更新
material.needsUpdate = true;
}
})
//更新viewer
viewer.impl.invalidate(true, true, true);
}
function setElevatorFloor(floor) {
if (floor == 0)
targetFloorZ = 0;
else if (floor == 1)
targetFloorZ = 14.6;// 15;
else if (floor == 2)
targetFloorZ = 24.6;// 26;
else if (floor == 3)
targetFloorZ = 34.6;
else if (floor == 4)
targetFloorZ = 44.6;
else if (floor == 5)
targetFloorZ = 54.6;
else if (floor == 6)
targetFloorZ = 64.6;
else if (floor == 7)
targetFloorZ = 74.6;
else if (floor == 8)
targetFloorZ = 84.6;
else if (floor == 9)
targetFloorZ = 94.6;
else if (floor == 10)
targetFloorZ = 104.6;
else if (floor == 11)
targetFloorZ = 114.6;
else if (floor == 12)
targetFloorZ = 124.6;
else if (floor == -1)
targetFloorZ = -13;
}
function setElevatorSpeed(speed) { //0.01 ~ 1
elevatorSpeed = speed;
}
function movElevator() {
let tree = viewer.model.getData().instanceTree;//三組:(749,750,751),(755,756,757),(761,762,763)
let nodeId = 12112;//12104; //749; //10952;
let nodeId2 = 12111;//12105; //750;
let nodeId3 = 12110;//12104; //751;
let fragProxyZ = 0;
var movStatus = 0; // 0=no 1=up 2=down
changeColor(nodeId3);
//setTransparency(0.2);
setTransparentBuilding();
if (fragProxy.position.z > targetFloorZ) {
movStatus = 2
}
else if (fragProxy.position.z < targetFloorZ) {
movStatus = 1
}
if (movStatus == 0) {
return;
}
tree.enumNodeFragments(nodeId, function (frag) {
fragProxy = viewer.impl.getFragmentProxy(viewer.model, frag);
fragProxy.getAnimTransform();
//let fragPosition = new THREE.Vector3(0, 0, 15);// 一樓0 二樓15 三樓 26
if (movStatus == 2) {
fragProxy.position.z -= elevatorSpeed;
}
else if (movStatus == 1) {
fragProxy.position.z += elevatorSpeed;
}
fragProxyZ = fragProxy.position.z;
fragProxy.updateAnimTransform()
});
viewer.impl.sceneUpdated(true);
tree.enumNodeFragments(nodeId2, function (frag) {
fragProxy = viewer.impl.getFragmentProxy(viewer.model, frag);
fragProxy.getAnimTransform();
//let fragPosition = new THREE.Vector3(0, 0, 15);// 一樓0 二樓15 三樓 26
if (movStatus == 2) {
fragProxy.position.z -= elevatorSpeed;
}
else if (movStatus == 1) {
fragProxy.position.z += elevatorSpeed;
}
fragProxyZ = fragProxy.position.z;
fragProxy.updateAnimTransform()
});
viewer.impl.sceneUpdated(true);
tree.enumNodeFragments(nodeId3, function (frag) {
fragProxy = viewer.impl.getFragmentProxy(viewer.model, frag);
fragProxy.getAnimTransform();
//let fragPosition = new THREE.Vector3(0, 0, 15);// 一樓0 二樓15 三樓 26
if (movStatus == 2) {
fragProxy.position.z -= elevatorSpeed;
}
else if (movStatus == 1) {
fragProxy.position.z += elevatorSpeed;
}
fragProxyZ = fragProxy.position.z;
fragProxy.updateAnimTransform()
});
viewer.impl.sceneUpdated(true);
if (movStatus == 2) {
if (fragProxyZ >= targetFloorZ) {
requestAnimationFrame(movElevator);
}
else {
hideColor(nodeId3);
//setTransparency(1);
recoverTransparentBuilding();
}
}
else if (movStatus == 1) {
if (fragProxyZ <= targetFloorZ) {
requestAnimationFrame(movElevator);
}
else {
hideColor(nodeId3);
//setTransparency(1);
recoverTransparentBuilding();
}
}
//let fragPosition = new THREE.Vector3(position);// 一樓0 二樓15 三樓 26
//fragProxy.position = fragPosition;
//fragProxy.updateAnimTransform();
//viewer.impl.sceneUpdated(true);
}
function changeColor(nodeId) {//電梯變綠色
var color = new THREE.Vector4(0, 1, 0, 1);
viewer.setThemingColor(nodeId, color);
}
function hideColor(nodeId) {//顏色改成透明
var color = new THREE.Vector4(0, 1, 0, 0);
viewer.setThemingColor(nodeId, color);
}
//function movElevator() {
// let tree = viewer.model.getData().instanceTree;
// let nodeId = 750;// 10952;
// let fragProxyZ = 0;
// var movStatus = 0; // 0=no 1=up 2=down
// if (fragProxy.position.z > targetFloorZ) {
// movStatus = 2
// }
// else if (fragProxy.position.z < targetFloorZ) {
// movStatus = 1
// }
// if (movStatus == 0) {
// return;
// }
// tree.enumNodeFragments(nodeId, function (frag) {
// fragProxy = viewer.impl.getFragmentProxy(viewer.model, frag);
// fragProxy.getAnimTransform();
// //let fragPosition = new THREE.Vector3(0, 0, 15);// 一樓0 二樓15 三樓 26
// if (movStatus == 2) {
// fragProxy.position.z -= elevatorSpeed;
// }
// else if (movStatus == 1) {
// fragProxy.position.z += elevatorSpeed;
// }
// fragProxyZ = fragProxy.position.z;
// fragProxy.updateAnimTransform()
// });
// viewer.impl.sceneUpdated(true);
// if (movStatus == 2) {
// if (fragProxyZ >= targetFloorZ) {
// requestAnimationFrame(movElevator);
// }
// }
// else if (movStatus == 1) {
// if (fragProxyZ <= targetFloorZ) {
// requestAnimationFrame(movElevator);
// }
// }
// //let fragPosition = new THREE.Vector3(position);// 一樓0 二樓15 三樓 26
// //fragProxy.position = fragPosition;
// //fragProxy.updateAnimTransform();
// //viewer.impl.sceneUpdated(true);
//}
function getAllDbIds(viewer) {
var instanceTree = viewer.model.getData().instanceTree;
var allDbIdsStr = Object.keys(instanceTree.nodeAccess.dbIdToIndex);
return allDbIdsStr.map(function (id) { return parseInt(id) });
}
//釋放viewer
function ReleaseViewer() {
viewer.finish();
viewer = null;
Autodesk.Viewing.shutdown();
}
//擴展類 刪除添加的所有DOM元素和事件
//ToolbarExtension.prototype.unload = function () {
// if (this.subToolbar) {
// this.viewer.toolbar.removeControl(this.subToolbar);
// this.subToolbar = null;
// }
//};
// ---- 模型剖面 ----
function getCutPlaneParam(idx, n) {
if (idx < 0 || !n) return;
const level = this.levels[idx];
if (!level) return;
//const precision = Autodesk.Viewing.Private.calculatePrecision( level.elevation );
const model = this.viewer.model;
const globalOffset = model.getData().globalOffset;
const units = model.getUnitString();
const elevRaw = Autodesk.Viewing.Private.convertUnits('ft', units, 1, level.elevation);
let d = elevRaw - globalOffset.z - 0.5;
if (n == 1)
d = -1 * d;
return new THREE.Vector4(0, 0, n, d);
}
function onButtonClicked() {
const upperSelector = document.getElementById('adn-upper-lvl-selector');
const lowerSelector = document.getElementById('adn-lower-lvl-selector');
if (!upperSelector || !lowerSelector)
return;
const upperIdx = upperSelector.selectedIndex;
const upperCutPlaneParam = this.getCutPlaneParam(upperIdx, 1);
const lowerIdx = lowerSelector.selectedIndex;
const lowerCutPlaneParam = this.getCutPlaneParam(lowerIdx, -1);
this.viewer.setCutPlanes([upperCutPlaneParam, lowerCutPlaneParam]);
}
function displayCuttedPlane() {
}
/**
* Autodesk.Viewing.Document.load() failuire callback.
*/
function onDocumentLoadFailure(viewerErrorCode) {
console.error("onDocumentLoadFailure() - errorCode:" + viewerErrorCode);
}
function getForgeToken(callback) {
// for 三菱
fetch(baseApiUrl + '/api/forge/oauth/token').then(res => {
res.json().then(data => {
callback(data.dictionary.access_token, data.dictionary.expires_in);
});
});
//for wsp get token
//var wspApiUrl = "https://quick-sonar-302302.de.r.appspot.com";
//fetch(wspApiUrl + '/api/forge/getToken').then(res => {
// res.json().then(data => {
// callback(data.access_token, data.expires_in);
// });
//});
//callback("eyJhbGciOiJSUzI1NiIsImtpZCI6IlU3c0dGRldUTzlBekNhSzBqZURRM2dQZXBURVdWN2VhIn0.eyJzY29wZSI6WyJkYXRhOnJlYWQiXSwiY2xpZW50X2lkIjoib0FoWVJBZkpvUkFRVFFqZmtBdExRSGkwYTIyc2pwSEoiLCJhdWQiOiJodHRwczovL2F1dG9kZXNrLmNvbS9hdWQvYWp3dGV4cDYwIiwianRpIjoiMm1EZ25yN0puYnhNUU91d2h2Y0lhTlZTOTIxOU9WMDlLZkZIRmhpa3BuMTUwbUNVbmRsVU9ZazdCMWxURXA4QiIsImV4cCI6MTY3MDk4NjgwM30.EfXtO7rdW25_WFxcFdYA-yWMUnRenuWc8MtvrM3i92jJU1_gZ7L1GJCLTH1MRJqnxp9X-oO4NToq1kt2sbUYWgwUPd3BvJwckr55s9hagy-0WENfUfEgX1csnrrKpnnbmlHIGQBgsUTklRRXleW6A63A0XkVH0GvJFv4h7K6-4gAi21SLhE_GwmbTWXSOxuoDnluIAVEDEf0ZmUYgnb4nImujScz876e4A0PagW0yf9-RSqmzNUctsasP6MBzLQxOHMd97jQvBDCFEzQqGgpbSTyc43Gdhy2wQM9sSxc_vR3ZvzJPm_78uda0HjH9M8B9SjwY07XHHdhGmbH-1FBQw", 3599);
}
async function loadHeatmaps(model) {
const dataVizExtn = await viewer.loadExtension("Autodesk.DataVisualization");
// Given a model loaded from Forge
const structureInfo = new Autodesk.DataVisualization.Core.ModelStructureInfo(model);
//x: -17.33, y: 51.03, z: -2.52
const devices = [
{
id: "Oficina 3",
//name: "Oficina-",
position: { x: 6.98, y: -19.00, z: 16.86 }, // x: 0, y: 25, z: -2.5 (-4.93, -20.61, 16.86)
sensorTypes: ["temperature", "humidity"]
},
{
id: "Oficina 2",
//name: "Oficina-",
position: { x: 35.85, y: -2.24, z: 16.86 }, // x: 0, y: 25.03, z: -2.52 (23.94, -3.85, 16.86)
sensorTypes: ["temperature", "humidity"]
},
{
id: "Oficina 1",
//name: "Oficina-",
position: { x: 6.98, y: -2.24, z: 16.86 }, // x: 0, y: 25.03, z: -2.52 (-4.93, -3.85, 16.86)
sensorTypes: ["temperature", "humidity"]
}
//{
// id: "Oficina 5",
// //name: "Oficina-",
// position: { x: 3.35, y: -4.81, z: 12.88 }, // x: 0, y: 25, z: -2.5 (3.35, -4.81, 12.88
// sensorTypes: ["temperature", "humidity"]
//},
//{
// id: "Oficina 4",
// //name: "Oficina-",
// position: { x: 37.03, y: -4.81, z: 12.88 }, // x: 0, y: 25.03, z: -2.52 (37.03, -4.81, 12.88)
// sensorTypes: ["temperature", "humidity"]
//},
//{
// id: "Oficina 3",
// //name: "Oficina-",
// position: { x: 2.83, y: -22.60, z: 12.88 }, // x: 0, y: 25.03, z: -2.52 (2.83, -22.60, 12.88)
// sensorTypes: ["temperature", "humidity"]
//}
];
//冷氣N5: (6.98, -19.00, 16.86), N4: (35.85, -2.24, 16.86), N3: (6.98, -2.24, 16.86)
// Initialize sensor values
let sensorVals = [];
for (let i = 0; i < devices.length; i++) {
sensorVals[i] = Math.random();
}
//var offset = Autodesk.viewer.model.getGlobalOffset();
//removeOffset(devices[0], offset)
//---------------- test node ---------------
// Retrive all dbIds that compose the stadium roof.
const it = viewer.model.getInstanceTree();
const roomDbIds = [];
//it.enumNodeChildren(
// 5027,//4239
// (id) => {
// if (it.getNodeName(id) == "【ARC】【樓板】RC") {//【ARC】【樓板】RC 樓板
// roomDbIds.push(id);
// }
// },
// true
//);
roomDbIds.push(11449);//5113 834 838 8106 8177 792 8181 7567
//roomDbIds.push(8183);
//roomDbIds.push(8185);
const {
SurfaceShadingData,
SurfaceShadingPoint,
SurfaceShadingNode,
} = Autodesk.DataVisualization.Core;
const shadingNode = new SurfaceShadingNode("Room Panel", roomDbIds);
devices.forEach((device) => {
const shadingPoint = new SurfaceShadingPoint(
device.id,
device.position,
device.sensorTypes
);
shadingNode.addPoint(shadingPoint);
});
// Generates `SurfaceShadingData` after assigning each device to a room.
//const shadingData = await Autodesk.structureInfo.generateSurfaceShadingData(devices);
//const shadingData = await structureInfo.generateSurfaceShadingData(devices);
//shadingData.initialize(model);
const heatmapData = new SurfaceShadingData();
heatmapData.addChild(shadingNode);
heatmapData.initialize(model);
// Setup surface shading
await dataVizExtn.setupSurfaceShading(model, heatmapData);
const sensorColors = [0x0000ff, 0x00ff00, 0xffff00, 0xff0000];//0 ~ 1 藍綠黃紅
//dataVizExtn.registerSurfaceShadingColors("co2", [0x00ff00, 0xff0000]); 0~1
dataVizExtn.registerSurfaceShadingColors("temperature", sensorColors);//[0xff0000, 0x0000ff]
function getSensorValue(device, sensorType) {
return sensorVals[parseInt(device.id.slice(-1)) - 1]; // 值: 0~1之間
//return 0;
}
dataVizExtn.renderSurfaceShading("Room Panel", "temperature", getSensorValue);
setInterval(() => {
// Modify sensor values.
for (let i = 0; i < devices.length; i++) {
sensorVals[i] = Math.random();
}
dataVizExtn.updateSurfaceShading(getSensorValue);
}, 2000);
//viewer.hide(5108);//五樓底下的六樓物件
//-------------------------------------------------------------------------------
// Use the resulting shading data to generate heatmap from.
//await dataVizExtn.setupSurfaceShading(model, shadingData);
// Register color stops for the heatmap. Along with the normalized sensor value
// in the range of [0.0, 1.0], `renderSurfaceShading` will interpolate the final
// heatmap color based on these specified colors.
//const sensorColors = [0x0000ff, 0x00ff00, 0xffff00, 0xff0000];
// Set heatmap colors for temperature
//const sensorType = "temperature";
//dataVizExtn.registerSurfaceShadingColors(sensorType, sensorColors);
// Function that provides sensor value in the range of [0.0, 1.0]
//function getSensorValue(surfaceShadingPoint, sensorType) {
// // The `SurfaceShadingPoint.id` property matches one of the identifiers passed
// // to `generateSurfaceShadingData` function. In our case above, this will either
// // be "cafeteria-entrace-01" or "cafeteria-exit-01".
// const deviceId = surfaceShadingPoint.id;
// // Read the sensor data, along with its possible value range
// let sensorValue = readSensorValue(deviceId, sensorType);
// const maxSensorValue = getMaxSensorValue(sensorType);
// const minSensorValue = getMinSensorValue(sensorType);
// // Normalize sensor value to [0, 1.0]
// sensorValue = (sensorValue - minSensorValue) / (maxSensorValue - minSensorValue);
// return clamp(sensorValue, 0.0, 1.0);
//}
// This value can also be a room instead of a floor
//const floorName = "01 - Entry Level";
//dataVizExtn.renderSurfaceShading(floorName, sensorType, getSensorValue);
//dataVizExtn.updateSurfaceShading(getSensorValue);
}
async function loadHeatmap() {
const model = viewer.model;
loadHeatmaps(model);
}
function hideObject() {
//viewer.hide(4);
//viewer.hide(58);
//viewer.hide(613);
//viewer.hide(640);
//viewer.hide(560);
for (var i = 0; i < allDbIdsStr.length; i++) {
viewer.hide(parseInt(allDbIdsStr[i]));
}
}
function openObject() {
//viewer.show(4);
//viewer.show(58);
//viewer.show(613);
//viewer.show(640);
//viewer.show(560);
for (var i = 0; i < allDbIdsStr.length; i++) {
viewer.show(parseInt(allDbIdsStr[i]));
}
}
async function setObjectTransparent() {
//setTransparency(4, 0);
//setTransparency(58, 0);
//setTransparency(613, 0);
//setTransparency(640, 0);
//setTransparency(560, 0);
//setTransparency(parseInt(515), 0);
//for (var i = 0; i < allDbIdsStr.length; i++) {
// setTransparency(parseInt(allDbIdsStr[i]), 0);
//}
//setTransparency(parseInt(515), 0);
//setTransparency(parseInt(516), 0);
//setTransparency(parseInt(517), 0);
//setTransparency(parseInt(518), 0);
//setTransparency(parseInt(519), 0);
//setTransparency(parseInt(399), 0);
//setTransparency(parseInt(101), 0);
//setTransparency(parseInt(100), 0);
//setTransparency(parseInt(58), 0);
//setTransparency(parseInt(587), 0);
//setTransparency(parseInt(586), 0);
//setTransparency(parseInt(585), 0);
//setTransparency(parseInt(584), 0);
//setTransparency(parseInt(583), 0);
//setTransparency(parseInt(562), 0);
//setTransparency(parseInt(361), 0);
//test();
//hideColor(587);
//hideColor(586);
//hideColor(585);
//hideColor(584);
//hideColor(583);
//hideColor(562);
//hideColor(361);
setTransparentBuilding();
}
async function cancelObjectTransparent() {
//setTransparency(4, 1);
//setTransparency(58, 1);
//setTransparency(613, 1);
//setTransparency(640, 1);
//setTransparency(560, 1);
//for (var i = 0; i < allDbIdsStr.length; i++) {
// setTransparency(parseInt(allDbIdsStr[i]), 1);
//}
//setTransparency(515, 0.2);
//setTransparency(516, 0.2);
//setTransparency(517, 0.2);
//setTransparency(518, 0.2);
//setTransparency(519, 0.2);
//setTransparency(399, 0.2);
//setTransparency(101, 0.2);
//setTransparency(100, 0.2);
//setTransparency(58, 0.2);
recoverTransparentBuilding();
}
async function test() {
var model = viewer.model;
var nodeId = 560;
var fragList = viewer.model.getFragmentList();
var fragIds = []
model.getData().instanceTree.enumNodeFragments(
nodeId, (fragId) => {
fragIds.push(fragId)
});
fragIds.forEach((fragId) => {
//获取材质
var material = fragList.getMaterial(fragId);
if (material) {
//设置透明度
material.opacity = 0;
material.transparent = true;
//标记更新
material.needsUpdate = true
}
})
//更新viewer
viewer.impl.invalidate(true, true, true)
}
//------------ 剖面 ----------------------
async function getRemoteLevels() {
const aecData = await Autodesk.Viewing.Document.getAecModelData(this.viewer.model.getDocumentNode());
if (!aecData.levels) return null;
const levels = aecData.levels;
levels.sort((a, b) => b.elevation - a.elevation);
return levels;
}
async function getLevelsData() {
const data = await this.getRemoteLevels();
this.levels = data;
}
//function getCutPlaneParam(idx, n) {
// if (idx < 0 || !n) return;
// const level = this.levels[idx];
// if (!level) return;
// //const precision = Autodesk.Viewing.Private.calculatePrecision( level.elevation );
// const model = this.viewer.model;
// const globalOffset = model.getData().globalOffset;
// const units = model.getUnitString();
// const elevRaw = Autodesk.Viewing.Private.convertUnits('ft', units, 1, level.elevation);
// let d = elevRaw - globalOffset.z - 0.5;
// if (n == 1)
// d = -1 * d;
// return new THREE.Vector4(0, 0, n, d);
//}
function profile() {
const upperIdx = 6;
const upperCutPlaneParam = this.getCutPlaneParam(upperIdx, 1);
const lowerIdx = 7;
const lowerCutPlaneParam = this.getCutPlaneParam(lowerIdx, -1);
this.viewer.setCutPlanes([upperCutPlaneParam, lowerCutPlaneParam]);
}
//----------------- end -----------------------------------------------
//--------------------------- 聚光燈 ----------------------------------
async function newLight() {
//聚光燈
//var spotLight;//聚光燈
//color -(可選)燈光的十六進制顏色。默認值為 0xffffff白色
//強度 -(可選)光強度 / 強度的數值。默認值為 1。
//distance - 燈光的最大範圍。默認值為 0無限制
//angle - 光從其上界為 Math.PI / 2 的方向散射的最大角度。
//半影 - 由於半影而衰減的聚光燈錐體的百分比。取值介於 0 和 1 之間。默認值為零。
//decay - 光沿光的距離變暗的量。
spotLight = new THREE.SpotLight(0xff0000, 200, 20, 0.6, 0.5, 10);//0xffffff 80, 10 //15, 20 , Math.PI / 12
spotLight.position.set(43.72, -15.65, -44.96); //set(-17.33, 51.03, -2.52); // -7.58, 18.20, -0.25 -44.96
spotLight.castShadow = false;
spotLight.visible = true;
spotLight.target.position.set(43.72, -15.65, -60);// -15.65 -48
viewer.scene.add(spotLight.target);
viewer.scene.add(spotLight);
viewer.impl.sceneUpdated(true);
//return spotLight;
//加入點燈光
//bulbLight = new THREE.PointLight(0xffffff, 50, 20, 2);//0xff0000
//bulbLight.position.set(43.72, -15.65, -44.96);//17.880840301513672
//bulbLight.castShadow = true;
//bulbLight.visible = true;
//viewer.scene.add(bulbLight);
//pointLightHelper = new THREE.PointLightHelper(pointLight);
//viewer.scene.add(pointLightHelper);
viewer.impl.sceneUpdated(true);
}
//-------------- 更改燈光範圍 --------------------------
function setLightPower(value) {
//bulbLight.intensity = (value * 10);
//bulbLight.distance = value;
viewer.impl.sceneUpdated(true);
}
function setLightValues(intensity, color) {// distance, angle, penumbra, decay,
viewer.scene.remove(spotLight)
spotLight.intensity = intensity;
//spotLight.distance = distance;
//spotLight.angle = angle;
//spotLight.penumbra = penumbra;
//spotLight.decay = decay;
var tempcolor = new THREE.Color().setHex(color);
spotLight.color = tempcolor;
viewer.impl.sceneUpdated(true);
viewer.scene.add(spotLight);
viewer.impl.sceneUpdated(true);
}
function setLightOpenOrClose(value) {//, light
if (value) {
//light.visible = true;
spotLight.visible = true;
//bulbLight.visible = true;
//testLight.visible = true;
}
else {
//light.visible = false;
spotLight.visible = false;
//bulbLight.visible = false;
//testLight.visible = false;
}
viewer.impl.sceneUpdated(true);
}
function setLightTransparency(value) {
bulbLight.intensity = (value * 10);
//bulbLight.
viewer.impl.sceneUpdated(true);
}
//------------- end -----------------------------------
function consoleList() {
console.log(tagIdDevList);
console.log(roomDataList);
}