var viewer; let fragProxy; var targetFloorZ; var elevatorSpeed; var allDbIdsStr; function launchViewer(urn) { 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; 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 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); } }); }); }); //viewer.loadExtension('ToolbarExtension'); viewer.addEventListener(Autodesk.Viewing.GEOMETRY_LOADED_EVENT, function () { var instanceTree = viewer.model.getData().instanceTree; allDbIdsStr = Object.keys(instanceTree.nodeAccess.dbIdToIndex); var domElem = document.getElementById('all_id'); domElem.innerText = allDbIdsStr; 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); }); //add toolbar fail //function ToolbarExtension(viewer, options) { // Autodesk.Viewing.Extension.call(this, viewer, options); //} //ToolbarExtension.prototype = Object.create(Autodesk.Viewing.Extension.prototype); //ToolbarExtension.prototype.constructor = ToolbarExtension; //ToolbarExtension.prototype.load = function () { // this.viewer.setLightPreset(6); // this.viewer.setEnvMapBackground(true); // this.viewer.fitToView(); // return true; //}; //ToolbarExtension.prototype.unload = function () { //}; //Autodesk.Viewing.theExtensionManager.registerExtension('ToolbarExtension', ToolbarExtension); //ToolbarExtension.prototype.onToolbarCreated = function (toolbar) { // //alert('TODO: customize Viewer toolbar'); // var viewer = this.viewer; // var button1 = new Autodesk.Viewing.UI.Button('show-env-bg-button'); // button1.onClick = function (e) { // viewer.setEnvMapBackground(true); // }; // button1.addClass('show-env-bg-button'); // button1.setToolTip('Show Environment'); // //SubToolbar // this.subToolbar = new Autodesk.Viewing.UI.ControlGroup('my-custom-toolbar'); // this.subToolbar.addControl(button1); // toolbar.addControl(this.subToolbar); //}; //NOP_VIEWER.getProperties(NOP_VIEWER.getSelection(), data => console.log(data)); } function setTransparentBuilding() { //allDbIdsStr.forEach((dbId) => { // setTransparency(dbId, 0.2); //}) for (var i = 0; i < allDbIdsStr.length; i++) { setTransparency(parseInt(allDbIdsStr[i]) , 0.2); } } 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) { fetch(baseApiUrl + '/api/forge/oauth/token').then(res => { res.json().then(data => { callback(data.dictionary.access_token, data.dictionary.expires_in); }); }); //callback("eyJhbGciOiJSUzI1NiIsImtpZCI6IlU3c0dGRldUTzlBekNhSzBqZURRM2dQZXBURVdWN2VhIn0.eyJzY29wZSI6WyJkYXRhOndyaXRlIiwiZGF0YTpyZWFkIiwiYnVja2V0OnJlYWQiLCJidWNrZXQ6dXBkYXRlIiwiYnVja2V0OmNyZWF0ZSJdLCJjbGllbnRfaWQiOiJUQTNocXNGZnpRYk5PVVhLcGxkS1VLU2V3NFNKMjF3NSIsImF1ZCI6Imh0dHBzOi8vYXV0b2Rlc2suY29tL2F1ZC9hand0ZXhwNjAiLCJqdGkiOiJiemxzWE5qWElvZ2R1UjUzTUJkdlhrTTNTT01qeVB1bHJrMmdTVWJudGNTeDg1b01kRG1xejg3Z05jenJkRzhpIiwiZXhwIjoxNjY4MTgzMDM2fQ.VU3qLwTJ9nlXnomKCdk4y5UcgszGEO_zlvE7w5mWWajeBMwKLo-zw7LJEqUEajRksvssppR9SbVsjLSx-vDVc3DRhCo3jYTWKPT1T3wQrlkOSqLeIrAdnKdBDNBWKgrGJt_xcmXc3dZ3XNKf9L_F6Ex808rUlo6cem1mcPpKl1jCBDqKu1mAX7aDtZ65TTQZbGGhbG4HdnET-d1i5w4LunGN11UAHhDUW3n0SWWIBL27PiiUQONZttajhD5st6IngYLcjr93BYVyJmDF7-wm4WZlHSw2OnXIfbJcFXEd83uVv_Rej4UXjzZ0e6kHwzc2nvGvKSIFu3Nt7CabdR8CkA", 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); const devices = [ { id: "Oficina 6", name: "Oficina-", position: { x: 22.475382737884104, y: 7.4884431474006163, z: 3.0 }, sensorTypes: ["temperature", "humidity"] } ]; var offset = Autodesk.viewer.model.getGlobalOffset(); removeOffset(devices[0], offset) // Generates `SurfaceShadingData` after assigning each device to a room. const shadingData = await Autodesk.structureInfo.generateSurfaceShadingData(devices); // 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); }