From 95e27805684e2f395886e31e54b78569295d8399 Mon Sep 17 00:00:00 2001
From: dev01 <dev01@yourteam.tw>
Date: Thu, 29 Dec 2022 16:03:58 +0800
Subject: [PATCH] =?UTF-8?q?[Frontend][=E7=B3=BB=E7=B5=B1=E7=9B=A3=E6=8E=A7?=
 =?UTF-8?q?]=20=E7=B8=BD=E8=A6=BD=20=E9=A1=AF=E7=A4=BA=E7=86=B1=E9=BB=9E?=
 =?UTF-8?q?=E5=8D=B3=E9=A1=AF=E7=A4=BApopover=20=E5=8F=8A=20focus=20?=
 =?UTF-8?q?=E9=A1=8F=E8=89=B2=E7=A8=8B=E5=BA=8F=E8=AA=BF=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 Frontend/_sysMonAll.html                      |  21 +-
 Frontend/_sysMonFloor.html                    | 155 +++++-----
 Frontend/_systemMonitor.html                  |   8 +-
 Frontend/index.html                           |   4 +-
 Frontend/js/forge/forgemodel.js               | 272 ++++++------------
 .../yourteam/plugins/yt-tooltip/yt-tooltip.js |  15 +-
 6 files changed, 194 insertions(+), 281 deletions(-)

diff --git a/Frontend/_sysMonAll.html b/Frontend/_sysMonAll.html
index 0c0779e..c15d475 100644
--- a/Frontend/_sysMonAll.html
+++ b/Frontend/_sysMonAll.html
@@ -37,7 +37,7 @@
 <script>
     var allDevList = [];  //全設備清單
     var devicePointList = [];
-    
+
     $(function () {
         getBuildMenu((arr, data) => {
             if (arr.indexOf(4) != -1) {
@@ -91,8 +91,8 @@
     }
     //baja 訂閱設備
     function subDevice() {
-        if (myBaja == null) {
-            myBaja = new subscriptionDevices();
+        
+            let myBaja = new subscriptionDevices();
             var ordPath = {
                 "area_tag": pageAct.AreaTag,
                 "building_tag": pageAct.buiTag,
@@ -123,7 +123,7 @@
             myBaja.setSubscribeDeviceEndCallBack(function (data) {
                 endPageLoading();
             });
-        }
+        
     }
     //根據 data-type 設置顏色 (判斷後台是否有設定，若無則帶預設)
     function setLightColor() {
@@ -256,7 +256,7 @@
 
     function show3DModel(urn) {
         launchViewerForHotspot(urn, (viewer, nodeIds) => {
-            loadHeatmap();
+            
         },"[name=forgeViewer]");
     }
 
@@ -298,13 +298,13 @@
         getHopspotPoint(myDataList);
     }
 
+    var parentEle = "";
     onEvent("autodesk:click:sprite", "[name=forgeViewer]", function (e, obj) {
-        debugger
         let position = {};
         position.tpLeft = obj.event.target.toolController.lastClickX;
         position.tpTop = obj.event.target.toolController.lastClickY;
         position.tpOffHeight = 24;
-        let parentEle = creDiv();
+        parentEle = creDiv();
         let devObj = obj.myData;
         parentEle.append(`<a href="javascript:;" name="devItem" class=" ml-2 mb-0 ">詳細資料</a>`);
         parentEle.data("id", devObj.device_guid);
@@ -313,13 +313,14 @@
         let name = allDevList.filter(x => x.device_guid == devObj.device_guid)[0]?.full_name;
         parentEle.data("name", name);
         
-        console.log(position)
-        console.log(obj.event)
-        console.log(obj.myData)
         initPopover(pageAct.sysMainTag == "LT" ? "light" : null, position, parentEle);
         $(parentEle).click();
        
     })
+
+    onEvent("autodesk:clickOut:sprite", "[name=forgeViewer]", function (e) {
+        $(parentEle).YTTooltip("hide");
+    })
     
     onEvent("autodesk:complete:sprite", "[name=forgeViewer]", function (e, obj) {
         $("#floDevList a[name=devItem]").each((idx, ele) => {
diff --git a/Frontend/_sysMonFloor.html b/Frontend/_sysMonFloor.html
index d95da90..87686c0 100644
--- a/Frontend/_sysMonFloor.html
+++ b/Frontend/_sysMonFloor.html
@@ -30,14 +30,12 @@
     var allDeviceRowData = []; //所有設備原始資料
     var global_emergency_alarm_device_number = [];
     var zoomToggle = 3;
-    var urn2 = "dXJuOmFkc2sub2JqZWN0czpvcy5vYmplY3Q6dnNjb2RlX2ZvcmdlX3Rlc3QvQVJDJUU1JTk2JUFFJUU1JUIxJUE0K01FUCVFNSU4NSVBOCVFNiVBMyU5Rl83Rl9ERU1PLm53ZA";
-    $(function () {
-        getHotspotPoint(() => {
-            show3DModel(urn2);
-        });
 
+    $(function () {
+        show3DModel();
         initChart();
         getFloData();
+        subDevice();
     })
 
     onEvent("click", "#resChartZoom", function () {
@@ -394,43 +392,79 @@
 
 
     }
-
-    //訂閱設備的回傳值，並塞到全域變數
-    function subscribeCallBack(change_device, is_need_reset = false) {
-        if (change_device != undefined && change_device != null) {
-            var target_device = allDeviceRowData.filter(x => x.device_number == change_device.device_number)[0];
-
-            if (target_device == undefined || target_device == null) {
-                //新增
-                obj = {
-                    device_number: change_device.device_number,
-                    points: [{
-                        name: change_device.point_name,
-                        value: change_device.value
-                    }]
-                };
-
-                allDeviceRowData.push(obj);
+    //baja 訂閱設備
+    function subDevice() {
+        
+            let floMyBaja = new subscriptionDevices();
+            var ordPath = {
+                "area_tag": pageAct.AreaTag,
+                "building_tag": pageAct.buiTag,
+                "system_tag": pageAct.sysMainTag,
+                "name_tag": pageAct.sysSubTag,
             }
-            else {
-                selected_device_point = target_device.points.find(x => x.name == change_device.point_name);
-                if (selected_device_point != null) {
-                    selected_device_point.value = change_device.value;
+            floMyBaja.setSubscribeDevicesByBql(ordPath);
+            floMyBaja.setSubscribeDevicesCallBack(function (data) {
+                console.log(data)
+                let matchDevice = allDeviceRowData.filter(x => x.device_number == data.device_number_full)[0];
+                if (!matchDevice) {
+                    return false;
                 }
-                else {
-                    obj = {
-                        name: change_device.point_name,
-                        value: change_device.value
-                    }
-                    target_device.points.push(obj);
-                }
-            }
+                let norDevPoiName = matchDevice.device_normal_point_name;
+                let cloDevPoiName = matchDevice.device_close_point_name;
+                let errDevPoiName = matchDevice.device_error_point_name;
 
-            if (is_need_reset) {
-                resetData();
-            }
-        }
+                if (data.point_name == norDevPoiName && data.value == matchDevice.device_normal_point_value) {
+                    //顯示正常燈號
+                    $(`#${matchDevice.device_number}_status`).attr("data-light-type", "normal").data("light-type", "normal");
+                } else if (data.point_name == cloDevPoiName && data.value == matchDevice.device_close_point_value) {
+                    $(`#${matchDevice.device_number}_status`).attr("data-light-type", "close").data("light-type", "close");
+                } else if (data.point_name == errDevPoiName && data.value == matchDevice.device_error_point_value) {
+                    $(`#${matchDevice.device_number}_status`).attr("data-light-type", "error").data("light-type", "error");
+                }
+                
+            });
+
+            floMyBaja.setSubscribeDeviceEndCallBack(function (data) {
+                endPageLoading();
+            });
+        
     }
+    // //訂閱設備的回傳值，並塞到全域變數
+    // function subscribeCallBack(change_device, is_need_reset = false) {
+    //     if (change_device != undefined && change_device != null) {
+    //         var target_device = allDeviceRowData.filter(x => x.device_number == change_device.device_number)[0];
+
+    //         if (target_device == undefined || target_device == null) {
+    //             //新增
+    //             obj = {
+    //                 device_number: change_device.device_number,
+    //                 points: [{
+    //                     name: change_device.point_name,
+    //                     value: change_device.value
+    //                 }]
+    //             };
+
+    //             allDeviceRowData.push(obj);
+    //         }
+    //         else {
+    //             selected_device_point = target_device.points.find(x => x.name == change_device.point_name);
+    //             if (selected_device_point != null) {
+    //                 selected_device_point.value = change_device.value;
+    //             }
+    //             else {
+    //                 obj = {
+    //                     name: change_device.point_name,
+    //                     value: change_device.value
+    //                 }
+    //                 target_device.points.push(obj);
+    //             }
+    //         }
+
+    //         if (is_need_reset) {
+    //             resetData();
+    //         }
+    //     }
+    // }
 
     // 重設平面圖設備資料
     function resetData() {
@@ -830,48 +864,9 @@
         }
     }
 
-    function show3DModel(urn) {
-        launchViewerForHotspot(urn, (viewer, nodeIds) => {
-            loadHeatmapForFloor();
+    function show3DModel() {
+        launchViewer("dXJuOmFkc2sub2JqZWN0czpvcy5vYmplY3Q6dnNjb2RlX2ZvcmdlX3Rlc3QvJUUzJTgwJTkwQVJDJUUzJTgwJTkxQjFGXzIwMjJfMTJfMDQubndj", (viewer, nodeIds) => {
+            
         });
     }
-
-    function getHotspotPoint(callback = null) {
-        let url = baseApiUrl + "/api/GetDevForCor";
-        let sendData = {
-            "device_area_tag": pageAct.AreaTag,
-            "device_building_tag": pageAct.buiTag,
-            "device_system_tag": pageAct.sysMainTag,
-            "device_name_tag": pageAct.sysSubTag,
-            "device_floor_tag": pageAct.floTag,
-        };
-        objSendData.Data = sendData;
-        ytAjax = new YourTeam.Ajax(url, objSendData, function (res) {
-            if (!res || res.code != "0000" || !res.data) {
-
-            } else {
-                debugger
-                let myDataList = [];
-                $.each(res.data, (idx, data) => {
-                    let item = {};
-                    item.position = {};
-                    if (item.device_coordinate_3d != null && isJSON(item.device_coordinate_3d)) {
-                        item.position = JSON.parse(x.device_coordinate_3d);
-                    }
-                    $.extend(item, data);
-                    myDataList.push(item);
-                })
-
-                console.log("1", myDataList)
-                setHotspotPoint(myDataList);
-                callback ? callback() : "";
-            }
-        }, null, "POST").send();
-
-    }
-
-    function setHotspotPoint(myDataList = []) {
-        console.log(myDataList)
-        getHopspotPoint(myDataList);
-    }
 </script>
\ No newline at end of file
diff --git a/Frontend/_systemMonitor.html b/Frontend/_systemMonitor.html
index 0f16397..653bb26 100644
--- a/Frontend/_systemMonitor.html
+++ b/Frontend/_systemMonitor.html
@@ -18,13 +18,19 @@
 
 <script>
     var floList = [];
-    var myBaja = null;
+   
     $(function () {
         $("#sysSubText").text(pageAct.sysSubName);
         getFloList();
     })
 
     onEvent("yt:tab:change", "[name=floBtn]", function () {
+        debugger
+        $.each(tolSubList, (idx, sub) => {
+                        sub.unsubscribeAll();
+                        sub.detach();
+                    })
+                    tolSubList=[];
         pageAct.floTag = $(this).data("id");
         if ($(this).data("id") == "all") {
             pageAct.floTag = null;
diff --git a/Frontend/index.html b/Frontend/index.html
index e868f8a..b66d937 100644
--- a/Frontend/index.html
+++ b/Frontend/index.html
@@ -2212,7 +2212,7 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
                         sub.unsubscribeAll();
                         sub.detach();
                     })
-
+                    tolSubList=[];
                     endPageLoading();
                     $(".yt-alert").YTAlert().hide();
 
@@ -2410,10 +2410,12 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
                             loadErr($(oriEle).data("number"));
                             $(tooltipEle).find("#info").html(typeof drawInfoTabBlo != "undefined" ? drawInfoTabBlo(devGuid) : "");
                             changeColorForHotspot($(oriEle).data("dbId"));
+                            changeScaleForHotspot($(oriEle).data("dbId"));
                             typeof subDeviceSetTable != "undefined " ? subDeviceSetTable($(oriEle).data("number")) : ""
                         },
                         onHide: function (tooltipEle, oriEle) {
                             changeColorForHotspot($(oriEle).data("dbId"),false);
+                            changeScaleForHotspot($(oriEle).data("dbId"),false);
                         }
                     };
 
diff --git a/Frontend/js/forge/forgemodel.js b/Frontend/js/forge/forgemodel.js
index 5a36d69..b957b65 100644
--- a/Frontend/js/forge/forgemodel.js
+++ b/Frontend/js/forge/forgemodel.js
@@ -478,6 +478,64 @@ function getForgeToken(callback) {
     //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);
+}
+
 function setTransparentBuilding() {
     //allDbIdsStr.forEach((dbId) => {
     //    setTransparency(dbId, 0.2);
@@ -563,6 +621,8 @@ async function addHotPoint(data) {
     const DataVizCore = Autodesk.DataVisualization.Core;
     const viewableType = Autodesk.DataVisualization.Core.ViewableType.SPRITE;//DataVizCore.ViewableType.SPRITE;
     const spriteColor = new THREE.Color(0xffffff);
+    const dbIdStart = 10;
+    const dbIdEnd = 19;
     let spriteIcon = "/file/img/forge/hotspot.svg";
     if (location.href.indexOf("localhost:5966") != -1) {
         spriteIcon = "/img/forge/hotspot.svg";
@@ -595,12 +655,19 @@ async function addHotPoint(data) {
 
     //---------------- 熱點點擊事件 --------------------
     function onSpriteClicked(event) {
+        event.hasStopped = true;
         if (event != undefined && event != null) {
-            if (event.dbId >= 10 && event.dbId <= 13) {//event.dbId > 0 && event.dbId < 19
+            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);
+                }
                 let myData = myDataList.filter(x => x._dbId == event.dbId)[0];
                 $(selector).trigger("autodesk:click:sprite", { event, myData });
+            } else {
+                $(selector).trigger("autodesk:clickOut:sprite", { event });
             }
 
             if (event.clickInfo != null) {
@@ -634,7 +701,7 @@ async function addHotPoint(data) {
 // 熱點 更換顏色
 async function changeColorForHotspot(dbId,type = true) {
     const dataVizExtn = await viewer.loadExtension("Autodesk.DataVisualization");
-    const spriteColorFocus = new THREE.Color(0x00ffe1);
+    let spriteColorFocus = new THREE.Color(0x00ffe1);
     if (!type) {
         spriteColorFocus = new THREE.Color(0xffffff);
     }
@@ -646,6 +713,21 @@ async function changeColorForHotspot(dbId,type = true) {
     });
 }
 
+// 熱點 更換大小
+async function changeScaleForHotspot(dbId,type = true) {
+    const dataVizExtn = await viewer.loadExtension("Autodesk.DataVisualization");
+    let scale = 1;
+    if(type){
+        scale = 1.2;
+    }
+    const viewablesToUpdate = dbId;
+    dataVizExtn.invalidateViewables(viewablesToUpdate, (viewable) => {
+        return {
+            scale: scale, // Restore the viewable size
+            //url: "https://.../circle.svg",
+        };
+    });
+}
 
 //------------------- end --------------
 
@@ -664,188 +746,4 @@ function closeHotspotModal() {
     //modal.style.display = "none";
 
 }
-//------------------ end --------------------------------
-
-//------------------ 熱圖 -------------------------------
-async function loadHeatmaps(model) {
-    const dataVizExtn = await viewer.loadExtension("Autodesk.DataVisualization");
-
-    //取三個空調設備的位置打點
-    const devices = [
-        //{
-        //    id: "Oficina 5",
-        //    position: { x: -4.93, y: -20.61, z: 16.86 }, // x: 0, y: 25, z: -2.5
-        //    sensorTypes: ["temperature", "humidity"]
-        //},
-        //{
-        //    id: "Oficina 4",
-        //    position: { x: 23.94, y: -3.85, z: 16.86 }, // x: 0, y: 25.03, z: -2.52
-        //    sensorTypes: ["temperature", "humidity"]
-        //},
-        //{
-        //    id: "Oficina 3",
-        //    position: { x: -4.93, y: -3.85, z: 16.86 }, // x: 0, y: 25.03, z: -2.52
-        //    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: (-4.93, -20.61, 16.86), N4: (23.94, -3.85, 16.86), N3: (-4.93, -3.85, 16.86)
-
-    // Initialize sensor values
-    let sensorVals = [];
-    for (let i = 0; i < devices.length; i++) {
-        sensorVals[i] = Math.random();
-    }
-
-    const roomDbIds = [];
-    roomDbIds.push(8181);//房間的dbid 七樓的 Room3-5 792
-    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);
-    });
-
-    const heatmapData = new SurfaceShadingData();
-    heatmapData.addChild(shadingNode);
-    heatmapData.initialize(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];
-    }
-
-    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);
-}
-//------------------ end --------------------------------
-async function loadHeatmapsForFloor(model) {
-
-    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: -4.93, y: -20.61, z: 16.86 }, // x: 0, y: 25, z: -2.5      (3.35, -4.81, 12.88
-            sensorTypes: ["temperature", "humidity"]
-        },
-        {
-            id: "Oficina 4",
-            //name: "Oficina-",
-            position: { x: 23.94, y: -3.85, z: 16.86 }, // x: 0, y: 25.03, z: -2.52  (37.03, -4.81, 12.88)
-            sensorTypes: ["temperature", "humidity"]
-        },
-        {
-            id: "Oficina 3",
-            //name: "Oficina-",
-            position: { x: -4.93, y: -3.85, z: 16.86 }, // x: 0, y: 25.03, z: -2.52   (2.83, -22.60, 12.88)
-            sensorTypes: ["temperature", "humidity"]
-        }
-    ];
-    //冷氣N5: (-4.93, -20.61, 16.86), N4: (23.94, -3.85, 16.86), N3: (-4.93, -3.85, 16.86)
-
-    // Initialize sensor values
-    let sensorVals = [];
-    for (let i = 0; i < devices.length; i++) {
-        sensorVals[i] = Math.random();
-    }
-
-    const roofDbIds = [];
-
-    roofDbIds.push(792);
-
-    const {
-        SurfaceShadingData,
-        SurfaceShadingPoint,
-        SurfaceShadingNode,
-    } = Autodesk.DataVisualization.Core;
-
-    const shadingNode = new SurfaceShadingNode("Roof Panel", roofDbIds);
-
-    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("Roof 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);
-}
\ No newline at end of file
+//------------------ end --------------------------------
\ No newline at end of file
diff --git a/Frontend/js/yourteam/plugins/yt-tooltip/yt-tooltip.js b/Frontend/js/yourteam/plugins/yt-tooltip/yt-tooltip.js
index 5b9cbb9..aa8a5e1 100644
--- a/Frontend/js/yourteam/plugins/yt-tooltip/yt-tooltip.js
+++ b/Frontend/js/yourteam/plugins/yt-tooltip/yt-tooltip.js
@@ -18,7 +18,7 @@
  */
 $.fn.YTTooltip = function (option) {
     let eleArr = [];
-
+    
     this.each(function (index, value) {
 
         let obj = {
@@ -40,6 +40,14 @@ $.fn.YTTooltip = function (option) {
             }
         };
 
+        if(typeof option == "string"){
+            if(option == "hide"){
+                let tooId = $(this).data("yttooltipid");
+                hideTooltipEvent(tooId);
+            }
+            return;
+        }
+    
         if (obj.toggle == "hover") {
             obj.toggle == "mouseenter"
         }
@@ -146,7 +154,9 @@ $.fn.YTTooltip = function (option) {
 
 
         function hideTooltipEvent(tooId) {
-            obj.onHide ? obj.onHide($("#yt_tooltip_" + tooId), obj.ele, obj) : "";
+            let onHide = $(obj.ele)[0]._ytTooltip.onHide;
+            let _obj = $(obj.ele)[0]._ytTooltip;
+            onHide ? onHide($("#yt_tooltip_" + tooId), _obj.ele, _obj) : "";
 
             $("#yt_tooltip_" + tooId).remove();
             obj.isShowArr.splice($.inArray(tooId, obj.isShowArr), 1);
@@ -168,6 +178,7 @@ $.fn.YTTooltip = function (option) {
 
         
         eleArr.push(obj);
+        $(obj.ele)[0]._ytTooltip = obj;
     })
 
     let result = eleArr.filter(x => this.toArray().findIndex(y => y == x.ele) != -1)[0];