jay.chang/ibms-dome
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[Frontend] loading 基礎程序建置 | forgemodel.js 3D 電梯物件化 | launchViewer 增加 option 參數補上 | 3D 圖換上三台電梯 urn

Browse Source
This commit is contained in:
dev01 2022-11-30 18:37:07 +08:00
parent 9e493a4117
commit 54438baa6a
3 changed files with 219 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
Frontend/_sysElevator.html
View File

@ -898,6 +898,9 @@
var subSeviceData = []; //每個設備訂閱點位值
var floList = []; //每個樓層
var elevObj = null; //左側 2D 電梯物件
var viewer3DNodeIds = [223, 228, 233];
var elev3DBind = {};
var elev3DOption = {};
var subOrdPath = {
"building_tag": pageAct.buiTag,
"system_tag": pageAct.sysMainTag,
@ -1069,9 +1072,15 @@
elevObj.curElevFloor[matchDevice.device_number] = subData["CP"];
elevObj.redraw();
} else {
elevObj.setElevFloor(matchDevice.device_number, subData["CP"]);
}
// 左側 3D 電梯 nodeID 與 device_number match
if (Object.keys(elev3DBind).indexOf(matchDevice.device_number) == -1) {
elev3DBind[matchDevice.device_number] = viewer3DNodeIds[elev3DBind.length];
}
elevObj.setEleMovStatus(matchDevice.device_number, subData["RD"] == "UP" ? 1 : subData["RD"] == "DOWN" ? 2 : 0);
//現在樓層
if (subData["CP"]) {
@ -2337,11 +2346,27 @@
//載入3D模型
function load3DModel() {
let option = {
nodes: [223, 228, 233],
element: "#forgeViewer",
floorHeight: [
{ floor: 1, height: 15 },
{ floor: 2, height: 24.5 },
{ floor: 3, height: 34 },
]
}
launchViewer('dXJuOmFkc2sub2JqZWN0czpvcy5vYmplY3Q6dGEzaHFzZmZ6cWJub3V4a3BsZGt1a3NldzRzajIxdzUtYmltc19tb2RlbHMvJUUzJTgwJTkwJUU1JThGJUIwJUU1JThDJTk3JUU0JUI4JUFEJUU4JThGJUIxJUU1JUE0JUE3JUU2JUE4JTkzJUUzJTgwJTkxQVJDLm53ZA==', option, () => {
console.log($("#forgeViewer"))
let elevator = $("#forgeViewer")[0]._elevator3D[0];
elevator.obj.setElevatorFloor(3)
elevator.obj.movElevator()
//setElevatorSpeed(0.2)
//setElevatorFloor(2)
//requestAnimationFrame(movElevator);
});
launchViewer('dXJuOmFkc2sub2JqZWN0czpvcy5vYmplY3Q6LW1vZGVsX3Rlc3QxMTIxLyVFMyU4MCU5MFRFU1QlRTMlODAlOTEubndk');
setElevatorSpeed(0.2)
setElevatorFloor(3)
movElevator()
}
function show3D() {
if (isFirstLoad3D) {

16
Frontend/index.html
View File

@ -2552,6 +2552,7 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
<script>
/*$('#js-page-content').smartPanel();*/
var jwt = localStorage.getItem("JWT-Authorization");
var pageAct = {}; //記錄全頁面已選擇項目
@ -2563,7 +2564,7 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
if (location.href.indexOf("ord") != -1) {
location.href = "/file/index.html"
}
pageLoading(true)
$(function () {
// 二次引用 jquery.js
// - 在 require 內部程序需要引用 jquery，由於 require 的套件需要依賴 jquery ，就算 HTML 已經引用 jquery， require 也無法參考
@ -2738,6 +2739,19 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
}
function pageLoading(isShow = true) {
if (isShow) {
if ($("body .loading-bg").length == 0) {
let background = $(`<div class="loading-bg"></div>`)
$("body").append(background);
} else {
$("body .loading-bg").show();
}
} else {
$("body .loading-bg").hide();
}
}
//==============================================================================
// ↓ 系統監控 - 共用 Function ↓
//==============================================================================

195
Frontend/js/forge/forgemodel.js
View File

@ -49,7 +49,7 @@ var elevatorSpeed;
// sensorVals[i] = Math.random();
// }
function launchViewer(urn) {
function launchViewer(urn, eleOption ,callback) {
var options = {
env: 'AutodeskProduction',
getAccessToken: getForgeToken
@ -60,8 +60,14 @@ function launchViewer(urn) {
//viewer = new Autodesk.Viewing.Viewer3D(document.getElementById('forgeViewer'));
viewer.start();
var documentId = 'urn:' + urn;
Autodesk.Viewing.Document.load(documentId, onDocumentLoadSuccess, onDocumentLoadFailure);
Autodesk.Viewing.Document.load(documentId, function (doc) {
onDocumentLoadSuccess(doc, eleOption);
}, onDocumentLoadFailure);
$("#forgeViewer").on("autodesk:loaded", function () {
callback ? callback() : "";
})
//test
@ -118,10 +124,139 @@ function getAllLeafComponents(viewer, callback) {
});
}
function onDocumentLoadSuccess(doc) {
class elevator3D {
constructor(option = {}) {
this.ele = option.element;
this.viewer = option.viewer;
this.nodeId = option.nodeId;
this.speed = option.speed ?? 0.3;
this.fragProxys = [];
this.fragProxy = null;
this.initCallback = option.inited ?? null;
this.movStatus = 0;
this.targetFloorZ = 0;
this.floorHeight = option.floorHeight ?? [{}];
this.init();
}
setTreeFrag = function () {
let tree = this.viewer.model.getData().instanceTree;
let nodeId = this.nodeId;
//tree.enumNodeChildren(nodeId, (node) => {
// nodeId = node;
// tree.enumNodeFragments(nodeId, (frag) => {
// this.fragProxy = this.viewer.impl.getFragmentProxy(this.viewer.model, frag);
// this.fragProxy.getAnimTransform();
// let fragPosition = new THREE.Vector3(0, 0, 0);// 一樓0 二樓15 三樓 26
// this.fragProxy.position = fragPosition
// this.fragProxy.updateAnimTransform()
// });
//})
tree.enumNodeFragments(nodeId, (frag) => {
let fragProxy = this.viewer.impl.getFragmentProxy(this.viewer.model, frag);
this.fragProxy = fragProxy;
this.fragProxys.push({ nodeId: nodeId, frag: fragProxy });
this.fragProxy.getAnimTransform();
let fragPosition = new THREE.Vector3(0, 0, 0);// 一樓0 二樓15 三樓 26
this.fragProxy.position = fragPosition;
this.fragProxy.updateAnimTransform();
},true);
this.viewer.impl.sceneUpdated(true);
if (typeof $(this.ele)[0]._elevator3D == "undefined") {
$(this.ele)[0]._elevator3D = [];
}
$(this.ele)[0]._elevator3D.push({ nodeId: nodeId, obj: this });
this.initCallback ? this.initCallback() : "";
}
init = function () {
this.setTreeFrag();
}
setElevatorFloor = function (floor) {
this.targetFloorZ = this.floorHeight.filter(x => x.floor == floor)[0].height;
}
setElevatorSpeed = function (speed) { //0.01 ~ 1
this.speed = speed;
}
movElevator = function () {
let tree = this.viewer.model.getData().instanceTree;
let nodeId = this.nodeId;
let fragProxyZ = 0;
let movStatus = this.movStatus; // 0=no 1=up 2=down
if (this.fragProxy.position.z > this.targetFloorZ) {
movStatus = 2
}
else if (this.fragProxy.position.z < this.targetFloorZ) {
movStatus = 1
}
if (movStatus == 0) {
return;
}
tree.enumNodeFragments(nodeId, (frag) => {
this.fragProxy = this.viewer.impl.getFragmentProxy(this.viewer.model, frag);
this.fragProxy.getAnimTransform();
//let fragPosition = new THREE.Vector3(0, 0, 15);// 一樓0 二樓15 三樓 26
if (movStatus == 2) {
this.fragProxy.position.z -= this.speed;
}
else if (movStatus == 1) {
this.fragProxy.position.z += this.speed;
}
fragProxyZ = this.fragProxy.position.z;
this.fragProxy.updateAnimTransform()
},true);
this.viewer.impl.sceneUpdated(true);
let movElevator = $(this.ele)[0]._elevator3D.filter(x => x.nodeId == this.nodeId)[0]?.obj.movElevator.bind(this);
if (movStatus == 2) {
if (fragProxyZ >= this.targetFloorZ) {
requestAnimationFrame(() => {
movElevator();
});
}
}
else if (movStatus == 1) {
if (fragProxyZ <= this.targetFloorZ) {
requestAnimationFrame(() => {
movElevator();
});
}
}
//let fragPosition = new THREE.Vector3(position);// 一樓0 二樓15 三樓 26
//fragProxy.position = fragPosition;
//fragProxy.updateAnimTransform();
//viewer.impl.sceneUpdated(true);
}
}
function onDocumentLoadSuccess(doc,eleOption) {
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();
@ -129,30 +264,48 @@ function onDocumentLoadSuccess(doc) {
// 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;
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 nodes = eleOption.nodes ?? [];
let element = eleOption.element ?? "";
$(element)[0]._elevator3D = [];
$.each(nodes, function (idx, node) {
let options = {
element: $(element),
viewer: viewer,
nodeId: node,
floorHeight: eleOption.floorHeight ?? [],
inited: function () {
if (idx == nodes.length - 1) {
$(element).trigger("autodesk:loaded");
}
}
}
let elevator3DObj = new elevator3D(options);
// let tree = viewer.model.getData().instanceTree;
// let nodeId = 10952;
})
// 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
//let tree = viewer.model.getData().instanceTree;
//let nodeId = 10952;
//console.log("tree", tree)
//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.position = fragPosition
// fragProxy.updateAnimTransform()
// fragProxy.updateAnimTransform()
//});
//viewer.impl.sceneUpdated(true);
//$("#forgeViewer").trigger("autodesk:loaded");
// });
// viewer.impl.sceneUpdated(true);
});
//});
}
function setElevatorFloor(floor) {
@ -215,7 +368,7 @@ function movElevator() {
requestAnimationFrame(movElevator);
}
}
//let fragPosition = new THREE.Vector3(position);// 一樓0 二樓15 三樓 26