From 7391959286641f34087f83fe3d17c9ba1aa0d00a Mon Sep 17 00:00:00 2001 From: wanli Date: Thu, 1 Dec 2022 11:53:46 +0800 Subject: [PATCH] =?UTF-8?q?[Frontend]=203D=E9=9B=BB=E6=A2=AF=E6=A8=A1?= =?UTF-8?q?=E5=9E=8B=E6=9B=B4=E6=96=B0=EF=BC=8C=E6=B8=AC=E8=A9=A6=E7=A7=BB?= =?UTF-8?q?=E5=8B=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- Frontend/forgetTest2.html | 349 ++++++++++----------------- Frontend/js/forge/modeltest.js | 416 +++++++++++++++++++++++++++++++++ 2 files changed, 538 insertions(+), 227 deletions(-) create mode 100644 Frontend/js/forge/modeltest.js diff --git a/Frontend/forgetTest2.html b/Frontend/forgetTest2.html index 31b822e..ffc87ea 100644 --- a/Frontend/forgetTest2.html +++ b/Frontend/forgetTest2.html @@ -1,241 +1,136 @@ - + + - - - - - - - - - Showing A360 Shared files + - - -
-
-
-
- - + + + + + + + + +
+

Robot Controls

+

Selected_ID:

+

All_ID:

+ + + + + + + + + + + + + + + 亮度 +
- +
+
+
+ + + + + + + + + + + - - - + + \ No newline at end of file diff --git a/Frontend/js/forge/modeltest.js b/Frontend/js/forge/modeltest.js new file mode 100644 index 0000000..a7edfcb --- /dev/null +++ b/Frontend/js/forge/modeltest.js @@ -0,0 +1,416 @@ +var viewer; + + + +// Initialize sensor values +//let sensorVals = []; +let fragProxy; +var targetFloorZ; +var elevatorSpeed; +// for (let i = 0; i < devices.length; i++) { +// sensorVals[i] = Math.random(); +// } + +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); + + + + //test + // for (let i = 0; i < urn.length; i++) { + // Autodesk.Viewing.Document.load(urn[i]["urn"], async (doc) => { + // let viewables = doc.getRoot().getDefaultGeometry(); + // let model = await viewer.loadDocumentNode(doc, viewables, { + // preserveView: false, + // keepCurrentModels: true, + // placementTransform: (new THREE.Matrix4()).setPosition(urn[i]["xform"]), + // keepCurrentModels: true, + // globalOffset: { + // x: 0, + // y: 0, + // z: 0 + // } + // }); + + // await viewer.waitForLoadDone(); //!<<< Wait for loading materials, properties and geometries for this model (URN) + // }); + // } + + //loadHeatmaps(viewer.getAllModels()[0]); //!<<< equals to viewer.model + + + + }); +} + +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]; + }); + + viewer.addEventListener(Autodesk.Viewing.GEOMETRY_LOADED_EVENT, function () { + var instanceTree = viewer.model.getData().instanceTree; + var allDbIdsStr = Object.keys(instanceTree.nodeAccess.dbIdToIndex); + var domElem = document.getElementById('all_id'); + domElem.innerText = allDbIdsStr; + + + + let tree = viewer.model.getData().instanceTree; + let nodeId = 749;//10952; + let nodeId2 = 750; + let nodeId3 = 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); + + }); + + NOP_VIEWER.getProperties(NOP_VIEWER.getSelection(), data => console.log(data)); +} + +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; + let nodeId = 749; //10952; + let nodeId2 = 750; + let nodeId3 = 751; + 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); + + 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 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 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) }); +} + +/** + * 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); +} \ No newline at end of file