[Frontend] 熱圖input 加入房間dbid，熱圖打點: 使用該層系統設備的座標
This commit is contained in:
wanli
parent
a3a0a0c963
commit
1eb730b15d
@ -867,8 +867,9 @@
|
||||
// show 3D 模型
|
||||
function show3DModel(urn) {
|
||||
launchViewerForHotspot(urn, (viewer, nodeIds) => {
|
||||
getLevelsData("R2F","RF")
|
||||
loadHeatmapForFloor();
|
||||
getLevelsData("R2F", "RF");//剖面的下方樓層，剖面的上方樓層
|
||||
var roomsArr = [10481, 10479];//七樓的兩間房間dbid
|
||||
toLoadHeatmap(roomsArr);
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
@ -1,10 +1,9 @@
|
||||
var viewer;
|
||||
|
||||
let fragProxy;
|
||||
var targetFloorZ;
|
||||
var elevatorSpeed;
|
||||
var selector = "#forgeViewer";
|
||||
let myDataList;
|
||||
var myDataList;//設備list
|
||||
var levels;//剖面用
|
||||
var lowerIdx;//剖面的下方樓層
|
||||
var upperIdx;//剖面的上方樓層
|
||||
@ -28,31 +27,6 @@ function launchViewer(urn, callback, _selector = "#forgeViewer") {
|
||||
callback ? callback(viewer, nodeIds) : "";
|
||||
})
|
||||
|
||||
|
||||
//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
|
||||
|
||||
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
@ -273,13 +247,6 @@ class elevator3D {
|
||||
hideColor(nodeId);
|
||||
return;
|
||||
}
|
||||
//let fragPosition = new THREE.Vector3(position);// 一樓0 二樓15 三樓 26
|
||||
|
||||
//fragProxy.position = fragPosition;
|
||||
|
||||
//fragProxy.updateAnimTransform();
|
||||
|
||||
//viewer.impl.sceneUpdated(true);
|
||||
}
|
||||
}
|
||||
|
||||
@ -287,14 +254,7 @@ 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();
|
||||
// var domElem = document.getElementById('id_printer');
|
||||
// domElem.innerText = currSelection[0];
|
||||
// });
|
||||
|
||||
viewer.addEventListener(Autodesk.Viewing.GEOMETRY_LOADED_EVENT, function () {
|
||||
let instanceTree = viewer.model.getData().instanceTree;
|
||||
console.log(instanceTree.nodeAccess)
|
||||
@ -304,8 +264,6 @@ function onDocumentLoadSuccess(doc, eleOption) {
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
|
||||
}
|
||||
|
||||
// 輔助函數，使用 Promise 封裝 viewer.getProperties 函數
|
||||
@ -393,14 +351,11 @@ function setElevatorSpeed(speed) { //0.01 ~ 1
|
||||
}
|
||||
|
||||
function movElevator() {
|
||||
|
||||
|
||||
let tree = viewer.model.getData().instanceTree;
|
||||
let nodeId = 10952;
|
||||
let fragProxyZ = 0;
|
||||
var movStatus = 0; // 0=no 1=up 2=down
|
||||
|
||||
|
||||
if (fragProxy.position.z > targetFloorZ) {
|
||||
movStatus = 2
|
||||
}
|
||||
@ -415,7 +370,6 @@ function movElevator() {
|
||||
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;
|
||||
}
|
||||
@ -439,15 +393,6 @@ function movElevator() {
|
||||
requestAnimationFrame(movElevator);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//let fragPosition = new THREE.Vector3(position);// 一樓0 二樓15 三樓 26
|
||||
|
||||
//fragProxy.position = fragPosition;
|
||||
|
||||
//fragProxy.updateAnimTransform();
|
||||
|
||||
//viewer.impl.sceneUpdated(true);
|
||||
}
|
||||
|
||||
function getAllDbIds(viewer) {
|
||||
@ -572,21 +517,12 @@ class ADHeatMaps {
|
||||
|
||||
|
||||
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);
|
||||
}
|
||||
@ -639,16 +575,6 @@ function hideColor(nodeId) {//顏色改成透明
|
||||
|
||||
}
|
||||
|
||||
//------------------ 紀錄熱點座標 ---------------
|
||||
function getHopspotPoint(data) {
|
||||
//var av = Autodesk.Viewing;
|
||||
myDataList = data;
|
||||
//viewer.addEventListener(av.GEOMETRY_LOADED_EVENT, addHotPoint, {
|
||||
// once: true,
|
||||
//});
|
||||
}
|
||||
//-------------------- end ----------------------
|
||||
|
||||
//------------------- 加入熱點 -----------------
|
||||
async function addHotPoint(data) {
|
||||
var viewer = data.target;
|
||||
@ -678,7 +604,7 @@ async function addHotPoint(data) {
|
||||
|
||||
myDataList.forEach((myData, index) => {
|
||||
const dbId = 10 + index;
|
||||
const myPosition = myData.position;
|
||||
const myPosition = JSON.parse(myData.device_coordinate_3d);
|
||||
const viewable = new DataVizCore.SpriteViewable(myPosition, style, dbId);
|
||||
myData._dbId = dbId;
|
||||
viewableData.addViewable(viewable);
|
||||
@ -694,7 +620,6 @@ async function addHotPoint(data) {
|
||||
if (event != undefined && event != null) {
|
||||
if (event.dbId >= dbIdStart && event.dbId <= dbIdEnd) {//event.dbId > 0 && event.dbId < 19
|
||||
console.log(`Sprite clicked: ${event.dbId}`);
|
||||
openHotspotModal();
|
||||
for (let i = dbIdStart; i <= dbIdEnd; i++) {
|
||||
changeColorForHotspot(i, false);
|
||||
changeScaleForHotspot(i, false);
|
||||
@ -721,7 +646,6 @@ async function addHotPoint(data) {
|
||||
// if (dbIds.length > 0) {
|
||||
// // 處理已選取元件的邏輯
|
||||
// $(selector).trigger("autodesk:click:sprite", event);
|
||||
// //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 {
|
||||
// // 處理沒有選取元件的邏輯
|
||||
@ -763,52 +687,16 @@ async function changeScaleForHotspot(dbId, type = true) {
|
||||
};
|
||||
});
|
||||
}
|
||||
//------------------------------ end ----------------------------------
|
||||
|
||||
//------------------- 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";
|
||||
|
||||
}
|
||||
//------------------ end --------------------------------
|
||||
|
||||
//------------------ 熱圖 -------------------------------
|
||||
async function loadHeatmaps(model) {
|
||||
//------------------------------ 熱圖 ---------------------------------
|
||||
async function loadHeatmaps(model, roomsArr) {
|
||||
const dataVizExtn = await viewer.loadExtension("Autodesk.DataVisualization");
|
||||
var devices = [];
|
||||
|
||||
//取三個空調設備的位置打點
|
||||
const devices = [
|
||||
{
|
||||
id: "Oficina 5",
|
||||
//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 4",
|
||||
//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 3",
|
||||
//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"]
|
||||
}
|
||||
];
|
||||
//冷氣N5: (-4.93, -20.61, 16.86), N4: (23.94, -3.85, 16.86), N3: (-4.93, -3.85, 16.86)
|
||||
myDataList.forEach((myData, index) => {
|
||||
devices.push({ id: index, position: JSON.parse(myData.device_coordinate_3d), sensorTypes: ["temperature", "humidity"] });
|
||||
});
|
||||
|
||||
// Initialize sensor values
|
||||
let sensorVals = [];
|
||||
@ -817,7 +705,9 @@ async function loadHeatmaps(model) {
|
||||
}
|
||||
|
||||
const roomDbIds = [];
|
||||
roomDbIds.push(7567);
|
||||
for (var i = 0; i < roomsArr.length; i++) {
|
||||
roomDbIds.push(roomsArr[i]);
|
||||
}
|
||||
|
||||
const {
|
||||
SurfaceShadingData,
|
||||
@ -842,11 +732,10 @@ async function loadHeatmaps(model) {
|
||||
|
||||
// Setup surface shading
|
||||
await dataVizExtn.setupSurfaceShading(model, heatmapData);
|
||||
|
||||
dataVizExtn.registerSurfaceShadingColors("temperature", [0xff0000, 0x0000ff]);
|
||||
|
||||
function getSensorValue(device, sensorType) {
|
||||
return sensorVals[parseInt(device.id.slice(-1)) - 1];
|
||||
return sensorVals[parseInt(device.id)];
|
||||
}
|
||||
|
||||
dataVizExtn.renderSurfaceShading("Room Panel", "temperature", getSensorValue);
|
||||
@ -859,97 +748,9 @@ async function loadHeatmaps(model) {
|
||||
dataVizExtn.updateSurfaceShading(getSensorValue);
|
||||
}, 2000);
|
||||
}
|
||||
//------------------ end --------------------------------
|
||||
async function loadHeatmapsForFloor(model) {
|
||||
//------------------------------ end ----------------------------------
|
||||
|
||||
const dataVizExtn = await viewer.loadExtension("Autodesk.DataVisualization");
|
||||
|
||||
//x: -17.33, y: 51.03, z: -2.52
|
||||
const devices = [
|
||||
{
|
||||
id: "Oficina 5",
|
||||
//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 4",
|
||||
//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 3",
|
||||
//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"]
|
||||
}
|
||||
];
|
||||
|
||||
// Initialize sensor values
|
||||
let sensorVals = [];
|
||||
for (let i = 0; i < devices.length; i++) {
|
||||
sensorVals[i] = Math.random();
|
||||
}
|
||||
|
||||
const roomDbIds = [];
|
||||
|
||||
roomDbIds.push(7567);
|
||||
|
||||
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);
|
||||
});
|
||||
|
||||
const heatmapData = new SurfaceShadingData();
|
||||
heatmapData.addChild(shadingNode);
|
||||
heatmapData.initialize(model);
|
||||
|
||||
// Setup surface shading
|
||||
await dataVizExtn.setupSurfaceShading(model, heatmapData);
|
||||
|
||||
//dataVizExtn.registerSurfaceShadingColors("co2", [0x00ff00, 0xff0000]);
|
||||
dataVizExtn.registerSurfaceShadingColors("temperature", [0xff0000, 0x0000ff]);
|
||||
|
||||
function getSensorValue(device, sensorType) {
|
||||
return sensorVals[parseInt(device.id.slice(-1)) - 1];
|
||||
}
|
||||
|
||||
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);
|
||||
}
|
||||
|
||||
//
|
||||
async function loadHeatmap() {
|
||||
const model = viewer.model;
|
||||
loadHeatmaps(model);
|
||||
}
|
||||
|
||||
async function loadHeatmapForFloor() {
|
||||
const model = viewer.model;
|
||||
loadHeatmapsForFloor(model);
|
||||
}
|
||||
|
||||
//------------ 剖面 ----------------------
|
||||
//--------------------------- -- 剖面 ---------------------------------
|
||||
async function getRemoteLevels() {
|
||||
const aecData = await Autodesk.Viewing.Document.getAecModelData(this.viewer.model.getDocumentNode());
|
||||
if (!aecData.levels) return null;
|
||||
@ -959,21 +760,6 @@ async function getRemoteLevels() {
|
||||
return levels2;
|
||||
}
|
||||
|
||||
async function getLevelsData(lowerFloor, upperFloor) {
|
||||
|
||||
const data = await this.getRemoteLevels();
|
||||
for (var i = 0; i < data.length; i++) {
|
||||
if ((data[i].name).indexOf(lowerFloor) != -1) {
|
||||
lowerIdx = i;
|
||||
}
|
||||
if ((data[i].name).indexOf(upperFloor) != -1) {
|
||||
upperIdx = i;
|
||||
}
|
||||
}
|
||||
this.levels = data;
|
||||
profile();
|
||||
}
|
||||
|
||||
function getCutPlaneParam(idx, n) {
|
||||
if (idx < 0 || !n) return;
|
||||
|
||||
@ -993,10 +779,38 @@ function getCutPlaneParam(idx, n) {
|
||||
}
|
||||
|
||||
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 -----------------------------------------------
|
||||
//------------------------------ end ----------------------------------
|
||||
|
||||
|
||||
//======================== 外部呼叫function ===========================
|
||||
//紀錄熱點座標
|
||||
function getHopspotPoint(data) {
|
||||
myDataList = data;
|
||||
}
|
||||
|
||||
//呼叫載入熱圖
|
||||
async function toLoadHeatmap(roomArr) {
|
||||
const model = viewer.model;
|
||||
loadHeatmaps(model, roomArr);
|
||||
}
|
||||
|
||||
//取得levels，執行剖面
|
||||
async function getLevelsData(lowerFloor, upperFloor) {
|
||||
|
||||
const data = await this.getRemoteLevels();
|
||||
for (var i = 0; i < data.length; i++) {
|
||||
if ((data[i].name).indexOf(lowerFloor) != -1) {
|
||||
lowerIdx = i;
|
||||
}
|
||||
if ((data[i].name).indexOf(upperFloor) != -1) {
|
||||
upperIdx = i;
|
||||
}
|
||||
}
|
||||
this.levels = data;
|
||||
profile();
|
||||
}
|
||||
//============================= end ===================================
|
||||
Loading…
Reference in New Issue
Block a user