From cf7752d995e09d48eca9a1ca5634a9e71ae46553 Mon Sep 17 00:00:00 2001
From: wangjuncheng <1>
Date: 星期二, 22 七月 2025 16:19:06 +0800
Subject: [PATCH] 透明度0 修改模型数据路径

---
 src/components/tools/LayerTree.vue |  587 ++++++++++++++++++++++++++++++---------------------------
 1 files changed, 308 insertions(+), 279 deletions(-)

diff --git a/src/components/tools/LayerTree.vue b/src/components/tools/LayerTree.vue
index f572dd8..c217cd7 100644
--- a/src/components/tools/LayerTree.vue
+++ b/src/components/tools/LayerTree.vue
@@ -13,30 +13,32 @@
 </template>
 
 <script setup>
+import { ref, onMounted, watch, nextTick, onUnmounted, watchEffect } from "vue";
 import {
-  ref,
-  onMounted,
-  watch,
-  nextTick,
-  onUnmounted,
-  computed,
-  watchEffect,
-} from "vue";
-import { createPoint, removeEntities, addTileset } from "@/utils/map";
+  createPoint,
+  removeEntities,
+  addTileset,
+  clearAllPoints,
+} from "@/utils/map";
 import { deviceDictList, getDictName } from "@/constant/dict.js";
 import { useRoute } from "vue-router";
-import { loadAreaPolygon, clearAreaPolygon } from "@/utils/area";
+import {
+  loadAreaPolygon,
+  convertToGeoJson,
+  clearAreaPolygon,
+} from "@/utils/area";
 import { checkedKeys } from "@/store/index";
-import { getDuanMainData, getDistrictListData } from "@/api/index.js";
-import { getDeviceInfo, getDangerPoint } from "@/api/hpApi";
-
+import { getDuanMainData } from "@/api/index.js";
 import { useSimStore } from "@/store/simulation";
+import { getSafePoint } from "@/api/hpApi";
 
 const simStore = useSimStore();
-
 const route = useRoute();
 
-// 鏍戝舰缁撴瀯鏁版嵁
+/**
+ * 鍥惧眰鏍戦厤缃暟鎹�
+ * 鍖呭惈涓夌淮鏈嶅姟鍜屽浘灞傛暟鎹袱澶у垎绫�
+ */
 const treeData = ref([
   {
     label: "涓夌淮鏈嶅姟",
@@ -58,301 +60,335 @@
   },
 ]);
 
-// 榛樿閫変腑鐨勮妭鐐�
-const defaultSelectedKeys = ref(["鍦板舰鏁版嵁"]); // 纭繚涓� treeData 鐨� label 瀹屽叏鍖归厤
+// 榛樿閫変腑鐨勮妭鐐癸紙鍦板舰鏁版嵁榛樿寮�鍚級
+const defaultSelectedKeys = ref(["鍦板舰鏁版嵁"]);
 
 // Tree 瀹炰緥寮曠敤
 const treeRef = ref(null);
 
-// 瀛樺偍鍥惧眰瀹炰綋鐨� Map
+// 瀛樺偍鍥惧眰瀹炰綋鐨� Map锛岀敤浜庣鐞嗘墍鏈夊浘灞�
 const treeMap = new Map();
 
-/**
- * 鍒濆鍖栧湴鍥�
- */
-// function initMap() {
-//   // 鍒濆鍖栧湴褰㈡暟鎹�
-//   let TerrainLayer = earthCtrl.factory.createTerrainLayer({
-//     sourceType: "ctb",
-//     url: "http://106.120.22.26:9103/gisserver/ctsserver/sungugoudem",
-//   });
-//   treeMap.set("鍦板舰鏁版嵁", TerrainLayer);
-//   console.log(TerrainLayer,'aaaa')
-//   // 鍒濆鍖栨ā鍨嬫暟鎹�
-//   // let modelPromise = addTileset(
-//   //   "http://106.120.22.26:9103/gisserver/c3dserver/sunhugou3d/tileset.json"
-//   // );
-//   // modelPromise.then((model) => {
-//   //   treeMap.set("妯″瀷鏁版嵁", model);
-//   // });
-
-//   // 鍒濆鍖栧奖鍍忔暟鎹�
-//   // let ImageryLayer = earthCtrl.factory.createImageryLayer({
-//   //   sourceType: "tms",
-//   //   url: "http://106.120.22.26:9103/gisserver/tmsserver/sunhugoudom",
-//   // });
-//   // treeMap.set("褰卞儚鏁版嵁", ImageryLayer);
-// }
-
-// 鍦板舰鏁版嵁
+// 鍦板舰鏁版嵁瀹炰緥
 let TerrainLayer = null;
-async function initMap() {
+// 褰卞儚鏁版嵁瀹炰緥
+let ImageryLayer = null;
+
+/**
+ * 鍒濆鍖栧湴褰㈡暟鎹浘灞�
+ */
+async function initTerrainLayer() {
   try {
-    // 鍒濆鍖栧湴褰㈡暟鎹紙浣跨敤await绛夊緟Promise瑙f瀽锛�
     TerrainLayer = await earthCtrl.factory.createTerrainLayer({
       sourceType: "ctb",
       url: "http://106.120.22.26:9103/gisserver/ctsserver/sunhugoudem",
-      // url: "https://tiles1.geovisearth.com/base/v1/terrain?token=486dac3bec56d7d7c2a581c150be2bd937462f1e8f3bc9c78b5658b396122405",
       requestVertexNormals: true,
     });
-
     treeMap.set("鍦板舰鏁版嵁", TerrainLayer);
   } catch (error) {
-    console.error("鍒濆鍖栧け璐�:", error);
+    console.error("鍦板舰鏁版嵁鍒濆鍖栧け璐�:", error);
   }
 }
 
 /**
- * 澶勭悊澶嶉�夋鐘舵�佸彉鍖�
+ * 鍒濆鍖栧奖鍍忔暟鎹浘灞�
  */
-// 搴旂敤鍒濆鍖栨椂棰勫厛鍔犺浇
-// 褰卞儚鏁版嵁鍒濆
-let ImageryLayer = null;
 async function initImageryLayer() {
-  ImageryLayer = await earthCtrl.factory.createImageryLayer({
-    sourceType: "tms",
-    url: "http://106.120.22.26:9103/gisserver/tmsserver/sunhugoudom",
-  });
+  try {
+    ImageryLayer = await earthCtrl.factory.createImageryLayer({
+      sourceType: "tms",
+      url: "http://106.120.22.26:9103/gisserver/tmsserver/sunhugoudom",
+    });
+    treeMap.set("褰卞儚鏁版嵁", ImageryLayer);
+  } catch (error) {
+    console.error("褰卞儚鏁版嵁鍒濆鍖栧け璐�:", error);
+  }
 }
 
-function handleCheckChange(data, checked, indeterminate) {
+/**
+ * 澶勭悊鏍戣妭鐐瑰嬀閫夊彉鍖�
+ * @param {Object} data - 鑺傜偣鏁版嵁
+ * @param {Boolean} checked - 鏄惁閫変腑
+ * @param {Boolean} indeterminate - 涓嶇‘瀹氱姸鎬�
+ */
+function handleCheckChange(data, checked) {
   const label = data.label;
-  if (label === "鍦板舰鏁版嵁") {
-    if (checked) {
-      initMap();
-      treeMap.set("鍦板舰鏁版嵁", TerrainLayer);
-      toggleLayerVisible("鍦板舰鏁版嵁", true); // 鏄剧ず褰卞儚鏁版嵁
-    } else {
-      const layer = treeMap.get("鍦板舰鏁版嵁");
-      if (layer) {
-        toggleLayerVisible("鍦板舰鏁版嵁", false); // 闅愯棌褰卞儚鏁版嵁
-        TerrainLayer.removeFromMap(); // 浠� Map 涓Щ闄�
-        console.log("褰卞儚鏁版嵁宸茬Щ闄�");
-      }
-    }
-  }
-  if (label === "褰卞儚鏁版嵁") {
-    if (checked) {
-      initImageryLayer();
-      // // 鍔犺浇褰卞儚鏁版嵁
-      // console.log("寮�濮嬪姞杞藉奖鍍忔暟鎹�...");
-      // ImageryLayer = earthCtrl.factory.createImageryLayer({
-      //   sourceType: "tms",
-      //   url: "http://106.120.22.26:9103/gisserver/tmsserver/sunhugoudom",
-      // });
-      treeMap.set("褰卞儚鏁版嵁", ImageryLayer);
-      toggleLayerVisible("褰卞儚鏁版嵁", true); // 鏄剧ず褰卞儚鏁版嵁
-    } else {
-      // 绉婚櫎褰卞儚鏁版嵁
-      const layer = treeMap.get("褰卞儚鏁版嵁");
-      if (layer) {
-        toggleLayerVisible("褰卞儚鏁版嵁", false); // 闅愯棌褰卞儚鏁版嵁
-        ImageryLayer.removeFromMap(); // 浠� Map 涓Щ闄�
-        console.log("褰卞儚鏁版嵁宸茬Щ闄�");
-      }
-    }
-    return;
-  }
-  if (label === "妯″瀷鏁版嵁") {
-    if (checked) {
-      // 鍔ㄦ�佸姞杞芥ā鍨嬫暟鎹�
-      console.log("寮�濮嬪姞杞芥ā鍨嬫暟鎹�...");
-      let modelPromise = addTileset(
-        "http://106.120.22.26:9103/gisserver/c3dserver/sunhugou3d/tileset.json"
-      );
 
-      modelPromise
-        .then((model) => {
-          console.log("妯″瀷鏁版嵁鍔犺浇瀹屾垚");
-          treeMap.set("妯″瀷鏁版嵁", model); // 灏嗘ā鍨嬫暟鎹瓨鍌ㄥ埌 treeMap
-          toggleLayerVisible("妯″瀷鏁版嵁", true); // 鏄剧ず妯″瀷鏁版嵁
-        })
-        .catch((error) => {
-          console.error("妯″瀷鏁版嵁鍔犺浇澶辫触:", error);
-        });
-    } else {
-      // 闅愯棌妯″瀷鏁版嵁
-      toggleLayerVisible("妯″瀷鏁版嵁", false);
-    }
+  // 鍦板舰鏁版嵁澶勭悊
+  if (label === "鍦板舰鏁版嵁") {
+    handleTerrainLayer(checked);
     return;
   }
+
+  // 褰卞儚鏁版嵁澶勭悊
+  if (label === "褰卞儚鏁版嵁") {
+    handleImageryLayer(checked);
+    return;
+  }
+
+  // 妯″瀷鏁版嵁澶勭悊
+  if (label === "妯″瀷鏁版嵁") {
+    handleModelLayer(checked);
+    return;
+  }
+
+  // 璁惧淇℃伅澶勭悊
   if (label === "缁煎悎鐩戞祴璁惧淇℃伅") {
     simStore.DeviceShowSwitch = checked;
-    if (checked) {
-      if (!treeMap.get("缁煎悎鐩戞祴璁惧淇℃伅")) {
-      } else {
-        toggleLayerVisible("缁煎悎鐩戞祴璁惧淇℃伅", true);
-      }
-    } else {
-      toggleLayerVisible("缁煎悎鐩戞祴璁惧淇℃伅", false);
-    }
     return;
   }
+
+  // 闅愭偅鐐瑰鐞�
   if (label === "瀛欒儭娌熼殣鎮g偣") {
     simStore.DangerShowSwitch = checked;
-    if (checked) {
-      if (!treeMap.get("瀛欒儭娌熼殣鎮g偣")) {
-      } else {
-        toggleLayerVisible("瀛欒儭娌熼殣鎮g偣", true);
-      }
-    } else {
-      toggleLayerVisible("瀛欒儭娌熼殣鎮g偣", false);
-    }
     return;
   }
 
-  // 鍏朵粬鍥惧眰鐨勫鐞嗛�昏緫
-  const list = treeMap.get(label);
-  if (list) {
+  // 鍏朵粬鍥惧眰鐨勫鐞�
+  const layer = treeMap.get(label);
+  if (layer) {
     toggleLayerVisible(label, checked);
-    return;
   }
+}
 
-  switch (label) {
-    case "褰卞儚鏁版嵁":
-    case "鍦板舰鏁版嵁":
-    case "鍖椾含甯傞殣鎮g偣":
-    case "瀛欒儭娌熼殣鎮g偣":
-    case "娉ョ煶娴侀殣鎮g偣闈㈡暟鎹�":
-    case "缁煎悎鐩戞祴璁惧淇℃伅":
-    case "瀛欒儭娌熸柇闈�":
-    case "閬块櫓鍦烘墍":
-      console.log(label, checked, indeterminate);
-      break;
+/**
+ * 澶勭悊鍦板舰鍥惧眰
+ */
+function handleTerrainLayer(checked) {
+  if (checked) {
+    initTerrainLayer();
+    toggleLayerVisible("鍦板舰鏁版嵁", true);
+  } else {
+    const layer = treeMap.get("鍦板舰鏁版嵁");
+    if (layer) {
+      toggleLayerVisible("鍦板舰鏁版嵁", false);
+      layer.removeFromMap();
+      treeMap.delete("鍦板舰鏁版嵁");
+    }
+  }
+}
+
+/**
+ * 澶勭悊褰卞儚鍥惧眰
+ */
+function handleImageryLayer(checked) {
+  if (checked) {
+    initImageryLayer();
+    toggleLayerVisible("褰卞儚鏁版嵁", true);
+  } else {
+    const layer = treeMap.get("褰卞儚鏁版嵁");
+    if (layer) {
+      toggleLayerVisible("褰卞儚鏁版嵁", false);
+      layer.removeFromMap();
+      treeMap.delete("褰卞儚鏁版嵁");
+    }
+  }
+}
+
+/**
+ * 澶勭悊妯″瀷鍥惧眰
+ */
+function handleModelLayer(checked) {
+  if (checked) {
+    addTileset(
+      // "http://106.120.22.26:9103/gisserver/c3dserver/sunhugou3d/tileset.json"
+      "http://192.168.37.61:9004/tile/model/service/Iakp0nhx/tileset.json?labtoken=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiItMSxUaHUgQXByIDE4IDE1OjMwOjU3IENTVCAyMDI0In0.j_YKsCRsIQtpgOWfFvMwAP65Rlx9uXyVte_xkE95Vdo"
+    )
+      .then((model) => {
+        treeMap.set("妯″瀷鏁版嵁", model);
+        toggleLayerVisible("妯″瀷鏁版嵁", true);
+      })
+      .catch(console.error);
+  } else {
+    toggleLayerVisible("妯″瀷鏁版嵁", false);
   }
 }
 
 /**
  * 鍒囨崲鍥惧眰鍙鎬�
+ * @param {String} name - 鍥惧眰鍚嶇О
+ * @param {Boolean} visible - 鏄惁鍙
  */
-function toggleLayerVisible(name, checked) {
-  const entityList = treeMap.get(name);
-  if (Array.isArray(entityList)) {
-    entityList.forEach((entity) => {
-      // console.log(`Setting entity show to:`, checked);
-      entity.show = checked;
-    });
-  } else if (entityList && typeof entityList.show !== "undefined") {
-    entityList.show = checked;
-  } else {
-    // console.error(`鏃犳硶璁剧疆鍥惧眰 ${name} 鐨勫彲瑙佹�);
+function toggleLayerVisible(name, visible) {
+  const layer = treeMap.get(name);
+  if (!layer) {
+    console.warn(`鍥惧眰 ${name} 涓嶅瓨鍦╜);
+    return;
   }
+
+  // 澶勭悊涓嶅悓绫诲瀷鐨勫浘灞�
+  if (Array.isArray(layer)) {
+    // 瀹炰綋鏁扮粍
+    layer.forEach((entity) => {
+      entity.show = visible;
+      if (visible && !viewer.entities.contains(entity)) {
+        viewer.entities.add(entity);
+      }
+    });
+  } else if (typeof layer.setVisible === "function") {
+    // 鑷畾涔夊浘灞傛帴鍙�
+    layer.setVisible(visible);
+  } else if (typeof layer.show === "boolean") {
+    // 鏅�氬彲鏄剧ず瀵硅薄
+    layer.show = visible;
+  }
+
+  viewer.scene.requestRender();
 }
 
-// 鐩戞祴璁惧鍒楄〃
-const devicetList = ref([]);
-
-// 鐩戞祴璁惧鍒楄〃
-const getDevicetList = async () => {
-  const res = await getDeviceInfo(); // 璋冩暣getDeviceInfo浠ユ帴鍙楀姩鎬佸弬鏁帮紝濡傛灉闇�瑕佺殑璇�
-  devicetList.value = res.data.pageData.filter((item) =>
-    item.deviceName?.includes("瀛欒儭娌�")
-  );
-};
-// 榛樿鍔犺浇閮ㄥ垎宸叉浛鎹㈣嚦Device.vue涓紝閫昏緫淇敼涓烘牴鎹綋鍓嶉�夋嫨鍦板舰鍒囨崲璁惧鐐规樉绀�
-async function initDevicePoint() {
-  let list = [];
-  await getDevicetList();
-  devicetList.value.forEach((item) => {
-    item.type = getDictName(deviceDictList, item.dictDeviceType);
-    item.name = item.deviceName.split("瀛欒儭娌�")[1];
-    item.id = item.deviceId;
-    item.className = "device";
-    item.showLabel = true;
-    const entity = createPoint(item);
-    entity.show = false;
-    list.push(entity);
-  });
-
-  treeMap.set("缁煎悎鐩戞祴璁惧淇℃伅", list);
-}
-
-// 闅愭偅鐐瑰垪琛�
-// watchEffect(() => {
-//   const dangerPoints = simStore.DangerPoint.filter((item) =>
-//     item.position?.includes("瀛欒儭娌�")
-//   );
-
-//   if (dangerPoints && dangerPoints.length > 0) {
-//     const list = [];
-
-//     dangerPoints.forEach((item) => {
-//       // console.log(item, "item");
-//       item.id = item.hdId;
-//       item.name = item.hdName;
-//       item.latitude = item.lat;
-//       item.longitude = item.lon;
-//       item.showBillboard = true;
-//       item.type = item.disasterType;
-//       item.className = "district";
-//       const entity = createPoint(item);
-//       entity.show = false;
-//       list.push(entity);
-//     });
-
-//     treeMap.set("瀛欒儭娌熼殣鎮g偣", list);
-//   }
-// });
-
-let divPointList = [];
 /**
- * 鍒濆鍖栨柇闈㈢偣
+ * 娓呴櫎鍥惧眰瀹炰綋
+ * @param {String} layerName - 鍥惧眰鍚嶇О
+ */
+// 鏆備笖淇濈暀
+// async function clearLayerEntities(layerName) {
+//   const list = treeMap.get(layerName);
+//   if (list && Array.isArray(list)) {
+//     for (const item of list) {
+//       const entity = await item;
+//       if (layerName == "缁煎悎鐩戞祴璁惧淇℃伅") {
+//         removeEntities(entity.deviceId);
+//       } else if (layerName == "瀛欒儭娌熼殣鎮g偣") {
+//         removeEntities(entity.hdId);
+//       }
+//     }
+//   }
+//   treeMap.delete(layerName);
+// }
+
+/**
+ * 娓呴櫎鍥惧眰瀹炰綋
+ * @param {String} layerName - 鍥惧眰鍚嶇О
+ */
+// 姝ゅ嚱鏁颁紭鍖栦簡鍦ㄦā鎷熶豢鐪熼〉闈紝濡傛灉鐐瑰嚮鐩綍鏍戦�変腑鍙栨秷锛屾偿浣嶈浠嶆樉绀�
+async function clearLayerEntities(layerName) {
+  const isMnfzPage = route.path === "/mnfz"; // 鍒ゆ柇鏄惁涓� /mnfz 椤甸潰
+
+  const list = treeMap.get(layerName);
+  if (list && Array.isArray(list)) {
+    for (const item of list) {
+      const entity = await item;
+
+      let shouldRemove = true; // 榛樿瑕佸垹闄�
+
+      // 濡傛灉鏄� /mnfz 椤甸潰锛屽苟涓旀槸鈥滄偿浣嶈鈥濓紝鍒欎笉鍒犻櫎
+      if (isMnfzPage && entity.type === "娉ヤ綅璁�") {
+        shouldRemove = false;
+      }
+
+      if (shouldRemove) {
+        if (layerName === "缁煎悎鐩戞祴璁惧淇℃伅") {
+          removeEntities(entity.deviceId);
+        } else if (layerName === "瀛欒儭娌熼殣鎮g偣") {
+          removeEntities(entity.hdId);
+        }
+      }
+    }
+  }
+
+  treeMap.delete(layerName);
+}
+
+watchEffect(async () => {
+  clearLayerEntities("缁煎悎鐩戞祴璁惧淇℃伅");
+
+  if (simStore.DeviceShowSwitch) {
+    // 浣跨敤 Promise.all 绛夊緟鎵�鏈夊紓姝ユ搷浣滃畬鎴�
+    const deviceListPromises = simStore.devices
+      .filter((item) => item.deviceName?.includes("瀛欒儭娌�"))
+      .map(async (item) => {
+        const entity = viewer.entities.getById(item.deviceId);
+        item.type = getDictName(deviceDictList, item.dictDeviceType);
+        item.name = item.deviceName.split("瀛欒儭娌�")[1];
+        item.id = item.deviceId;
+        item.className = "device";
+        item.showLabel = true;
+        await createPoint(item); // 纭繚 createPoint 杩斿洖涓�涓� Promise 鎴栬�呮湰韬氨鏄紓姝ュ嚱鏁�
+        return item; // 杩斿洖澶勭悊鍚庣殑 item
+      });
+
+    // 绛夊緟鎵�鏈夊紓姝ユ搷浣滃畬鎴�
+    const deviceList = await Promise.all(deviceListPromises);
+
+    if (deviceList.length) {
+      treeMap.set("缁煎悎鐩戞祴璁惧淇℃伅", deviceList);
+    }
+  }
+});
+
+// 鐩戞帶闅愭偅鐐瑰紑鍏冲彉鍖�
+watchEffect(async () => {
+  clearLayerEntities("瀛欒儭娌熼殣鎮g偣");
+
+  if (simStore.DangerShowSwitch) {
+    const filteredPoints = simStore.DangerPoint.filter((item) =>
+      item.position?.includes("瀛欒儭娌�")
+    );
+
+    const dangerPointPromises = filteredPoints.map(async (item) => {
+      const entity = viewer.entities.getById(item.hdId);
+      item.id = item.hdId;
+      item.name = item.hdName;
+      item.latitude = item.lat;
+      item.longitude = item.lon;
+      item.showBillboard = true;
+      item.type = item.disasterType;
+      item.className = "district";
+      await createPoint(item); // 纭繚 createPoint 鏄紓姝ュ嚱鏁�
+      return item; // 杩斿洖澶勭悊濂界殑 item
+    });
+
+    try {
+      const resolvedPoints = await Promise.all(dangerPointPromises);
+
+      if (resolvedPoints.length) {
+        treeMap.set("瀛欒儭娌熼殣鎮g偣", resolvedPoints);
+      }
+    } catch (error) {
+      console.error("鍒涘缓闅愭偅鐐规椂鍙戠敓閿欒:", error);
+    }
+  }
+});
+
+/**
+ * 鍒濆鍖栨柇闈㈢偣鏁版嵁
  */
 function initDuanmianPoint() {
   getDuanMainData().then((res) => {
-    const duanmianList = res.data;
-    const list = [];
-    duanmianList.forEach((item) => {
-      item.id = item.id + item.alias;
-      item.name = item.alias;
-      item.longitude = item.lon;
-      item.latitude = item.lat;
-      item.showBillboard = false;
-      item.className = "district";
-
-      const entity = createPoint(item);
+    const list = res.data.map((item) => {
+      const entity = createPoint({
+        id: item.id + item.alias,
+        name: item.alias,
+        latitude: item.lat,
+        longitude: item.lon,
+        showBillboard: false,
+        className: "district",
+      });
       entity.show = false;
-      list.push(entity);
+      return entity;
     });
     treeMap.set("瀛欒儭娌熸柇闈�", list);
   });
 }
 
 /**
- * 娣诲姞閬块櫓鍦烘墍
+ * 娣诲姞閬块櫓鍦烘墍鏁版嵁
  */
-function addTetrahedron(visible) {
-  const emergencyAreaList = [];
-  // 鍔犺浇閬块櫓鍦烘墍搴曞眰闈㈢墖
-  loadAreaPolygon("/json/emergency_area.geojson", true).then((entities) => {
-    emergencyAreaList.push(...entities);
-
-    // 榛樿闅愯棌閬块櫓鍦烘墍
-    entities.forEach((entity) => {
-      entity.show = false;
+function addTetrahedron() {
+  getSafePoint(110116110218).then((res) => {
+    const geoJsonData = convertToGeoJson(res.data); // 杞崲涓� GeoJSON
+    // 鍔犺浇 GeoJSON 鏁版嵁鍒板湴鍥�
+    loadAreaPolygon(geoJsonData, true).then((entities) => {
+      entities.forEach((entity) => (entity.show = false));
+      treeMap.set("閬块櫓鍦烘墍", entities);
     });
-
-    // 灏嗛伩闄╁満鎵�瀹炰綋瀛樺偍鍒� treeMap
-    treeMap.set("閬块櫓鍦烘墍", entities);
   });
 }
 
 /**
  * 鍒濆鍖栨墍鏈夋暟鎹�
  */
-function getData() {
-  // initDevicePoint();
-  // initDistrictPoint();
+function initData() {
   initDuanmianPoint();
   addTetrahedron();
 }
@@ -361,11 +397,8 @@
 watch(
   () => checkedKeys.value,
   (keys) => {
-    if (keys && Array.isArray(keys)) {
-      treeRef.value.setCheckedKeys(
-        defaultSelectedKeys.value.concat(keys),
-        true
-      );
+    if (Array.isArray(keys)) {
+      treeRef.value?.setCheckedKeys([...defaultSelectedKeys.value, ...keys]);
     }
   }
 );
@@ -374,57 +407,53 @@
 watch(
   () => route.fullPath,
   (path) => {
-    const defaultKeys = defaultSelectedKeys.value;
-    if (path == "/yhgl") {
-      treeRef.value.setCheckedKeys(defaultKeys.concat("瀛欒儭娌熼殣鎮g偣"), true);
-      toggleLayerVisible("瀛欒儭娌熼殣鎮g偣", true);
-      toggleLayerVisible("缁煎悎鐩戞祴璁惧淇℃伅", false);
-      toggleLayerVisible("瀛欒儭娌熸柇闈�", false);
-    } else if (path == "/zhjc") {
-      treeRef.value.setCheckedKeys(
-        defaultKeys.concat("缁煎悎鐩戞祴璁惧淇℃伅"),
-        true
-      );
-      toggleLayerVisible("缁煎悎鐩戞祴璁惧淇℃伅", true);
-      toggleLayerVisible("瀛欒儭娌熼殣鎮g偣", false);
-      toggleLayerVisible("瀛欒儭娌熸柇闈�", false);
-    } else if (path == "/mnfz") {
-      treeRef.value.setCheckedKeys(defaultKeys.concat("瀛欒儭娌熸柇闈�"), false);
-      toggleLayerVisible("瀛欒儭娌熸柇闈�", false);
-      toggleLayerVisible("瀛欒儭娌熼殣鎮g偣", false);
-      toggleLayerVisible("缁煎悎鐩戞祴璁惧淇℃伅", false);
-    } else {
-      treeRef.value.setCheckedKeys(defaultKeys, true);
-    }
-  }
+    const defaultKeys = [...defaultSelectedKeys.value];
+    const checkedKeys =
+      {
+        // 椤甸潰榛樿鍕鹃�夋樉绀哄湪姝ゅ
+        "/yhgl": [...defaultKeys, "瀛欒儭娌熼殣鎮g偣"],
+        "/zhjc": [...defaultKeys, "缁煎悎鐩戞祴璁惧淇℃伅"],
+        // "/mnfz": [...defaultKeys, "瀛欒儭娌熸柇闈�"],
+      }[path] || defaultKeys;
+
+    treeRef.value?.setCheckedKeys(checkedKeys);
+  },
+  { immediate: true }
 );
 
 // 缁勪欢鎸傝浇鏃跺垵濮嬪寲
 onMounted(() => {
-  initMap();
-  getData();
+  initTerrainLayer();
+  initData();
   nextTick(() => {
-    // 纭繚鏍戠粍浠舵覆鏌撳畬鎴愬悗璁剧疆榛樿閫変腑椤�
-    treeRef.value.setCheckedKeys(defaultSelectedKeys.value, true);
+    treeRef.value?.setCheckedKeys(defaultSelectedKeys.value);
   });
 });
 
 // 缁勪欢鍗歌浇鏃舵竻鐞嗚祫婧�
 onUnmounted(() => {
   viewer.entities.removeAll();
+  // 娓呯悊鎵�鏈夊浘灞傚紩鐢�
+  treeMap.forEach((layer) => {
+    if (layer.removeFromMap) {
+      layer.removeFromMap();
+    }
+  });
+  treeMap.clear();
 });
 </script>
 
 <style lang="less" scoped>
 @import url("../../assets/css/infobox.css");
+
 .layer-tree {
   background: url("@/assets/img/tools/plotting_new.png");
   width: 200px;
-  // height: 200px;
   z-index: 99;
   overflow: hidden;
-}
-/deep/ .el-tree {
-  overflow: hidden !important;
+
+  :deep(.el-tree) {
+    overflow: hidden !important;
+  }
 }
 </style>

--
Gitblit v1.9.3