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 | 622 ++++++++++++++++++++++++++++++++++---------------------
1 files changed, 384 insertions(+), 238 deletions(-)
diff --git a/src/components/tools/LayerTree.vue b/src/components/tools/LayerTree.vue
index 6105ceb..c217cd7 100644
--- a/src/components/tools/LayerTree.vue
+++ b/src/components/tools/LayerTree.vue
@@ -1,19 +1,44 @@
<template>
<div class="layer-tree">
- <el-tree ref="treeRef" style="max-width: 600px" show-checkbox
- :default-checked-keys="defaultSelectedKeys" @check-change="handleCheckChange" :data="treeData" />
+ <el-tree
+ ref="treeRef"
+ style="max-width: 600px"
+ show-checkbox
+ node-key="label"
+ :default-checked-keys="defaultSelectedKeys"
+ @check-change="handleCheckChange"
+ :data="treeData"
+ />
</div>
</template>
<script setup>
-import { ref, onMounted, onBeforeUnmount, watch, onUnmounted } from "vue";
-import { createPoint, removeEntities, addTileset } from "@/utils/map";
+import { ref, onMounted, watch, nextTick, onUnmounted, watchEffect } from "vue";
+import {
+ 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, getDevicetListData, getDistrictListData } from "@/api/index.js";
+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: "涓夌淮鏈嶅姟",
@@ -26,288 +51,409 @@
{
label: "鍥惧眰鏁版嵁",
children: [
- {
- label: "鍖椾含甯傞殣鎮ｇ偣",
- },
- {
- label: "瀛欒儭娌熼殣鎮ｇ偣",
- },
- // {
- // label: "娉ョ煶娴侀殣鎮ｇ偣闈㈡暟鎹�",
- // },
- {
- label: "缁煎悎鐩戞祴璁惧淇℃伅",
- },
- {
- label: "瀛欒儭娌熸柇闈�",
- },
- {
- label: "閬块櫓鐐�",
- },
+ { label: "鍖椾含甯傞殣鎮ｇ偣" },
+ { label: "瀛欒儭娌熼殣鎮ｇ偣" },
+ { label: "缁煎悎鐩戞祴璁惧淇℃伅" },
+ { label: "瀛欒儭娌熸柇闈�" },
+ { label: "閬块櫓鍦烘墍" },
],
},
]);
-const treeRef = ref(null);
-const treeMap = new Map();
-const defaultSelectedKeys = ref(["妯″瀷鏁版嵁", "褰卞儚鏁版嵁", "鍦板舰鏁版嵁"]);
-function handleCheckChange(data, checked, indeterminate) {
- const label = data.label;
- const list = treeMap.get(label);
- if (list) {
- toggleLayerVisible(label, checked);
+// 榛樿閫変腑鐨勮妭鐐癸紙鍦板舰鏁版嵁榛樿寮�鍚級
+const defaultSelectedKeys = ref(["鍦板舰鏁版嵁"]);
+
+// Tree 瀹炰緥寮曠敤
+const treeRef = ref(null);
+
+// 瀛樺偍鍥惧眰瀹炰綋鐨� Map锛岀敤浜庣鐞嗘墍鏈夊浘灞�
+const treeMap = new Map();
+
+// 鍦板舰鏁版嵁瀹炰緥
+let TerrainLayer = null;
+// 褰卞儚鏁版嵁瀹炰緥
+let ImageryLayer = null;
+
+/**
+ * 鍒濆鍖栧湴褰㈡暟鎹浘灞�
+ */
+async function initTerrainLayer() {
+ try {
+ TerrainLayer = await earthCtrl.factory.createTerrainLayer({
+ sourceType: "ctb",
+ url: "http://106.120.22.26:9103/gisserver/ctsserver/sunhugoudem",
+ requestVertexNormals: true,
+ });
+ treeMap.set("鍦板舰鏁版嵁", TerrainLayer);
+ } catch (error) {
+ console.error("鍦板舰鏁版嵁鍒濆鍖栧け璐�:", error);
+ }
+}
+
+/**
+ * 鍒濆鍖栧奖鍍忔暟鎹浘灞�
+ */
+async function initImageryLayer() {
+ 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);
+ }
+}
+
+/**
+ * 澶勭悊鏍戣妭鐐瑰嬀閫夊彉鍖�
+ * @param {Object} data - 鑺傜偣鏁版嵁
+ * @param {Boolean} checked - 鏄惁閫変腑
+ * @param {Boolean} indeterminate - 涓嶇‘瀹氱姸鎬�
+ */
+function handleCheckChange(data, checked) {
+ const label = data.label;
+
+ // 鍦板舰鏁版嵁澶勭悊
+ if (label === "鍦板舰鏁版嵁") {
+ handleTerrainLayer(checked);
return;
}
- switch (label) {
- case "妯″瀷鏁版嵁":
- case "褰卞儚鏁版嵁":
- case "鍦板舰鏁版嵁":
- console.warn(`鏈垵濮嬪寲 ${label} 鐨勫浘灞俙);
- break;
- case "鍖椾含甯傞殣鎮ｇ偣":
- case "瀛欒儭娌熼殣鎮ｇ偣":
- case "娉ョ煶娴侀殣鎮ｇ偣闈㈡暟鎹�":
- case "缁煎悎鐩戞祴璁惧淇℃伅":
- case "瀛欒儭娌熸柇闈�":
- case "閬块櫓鐐�":
- console.log(label, checked, indeterminate);
- break;
+
+ // 褰卞儚鏁版嵁澶勭悊
+ if (label === "褰卞儚鏁版嵁") {
+ handleImageryLayer(checked);
+ return;
+ }
+
+ // 妯″瀷鏁版嵁澶勭悊
+ if (label === "妯″瀷鏁版嵁") {
+ handleModelLayer(checked);
+ return;
+ }
+
+ // 璁惧淇℃伅澶勭悊
+ if (label === "缁煎悎鐩戞祴璁惧淇℃伅") {
+ simStore.DeviceShowSwitch = checked;
+ return;
+ }
+
+ // 闅愭偅鐐瑰鐞�
+ if (label === "瀛欒儭娌熼殣鎮ｇ偣") {
+ simStore.DangerShowSwitch = checked;
+ return;
+ }
+
+ // 鍏朵粬鍥惧眰鐨勫鐞�
+ const layer = treeMap.get(label);
+ if (layer) {
+ toggleLayerVisible(label, checked);
}
}
-function initMap() {
- // 鍒濆鍖栨ā鍨嬫暟鎹�
- 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 = earthCtrl.factory.createTerrainLayer({
- // sourceType: "ctb",
- // url: "http://106.120.22.26:9103/gisserver/ctsserver/sungugoudem",
- // });
- // treeMap.set("鍦板舰鏁版嵁", TerrainLayer);
-}
-const devicetList = ref([]);
-const getDevicetList = async () => {
- await getDevicetListData().then((res) => {
- console.log(res.data, 'devicetList.value2');
- devicetList.value = res.data;
- })
-};
-
-async function initDevicePoint() {
- let list = [];
- await getDevicetList();
- devicetList.value.forEach((item) => {
- item.type = getDictName(deviceDictList, item.dictDeviceType);
- item.name = item.type;
- item.id = item.deviceId;
- item.className = "device";
- item.showLabel = true;
- const entity = createPoint(item);
- entity.show = false;
- list.push(entity);
- });
-
- treeMap.set("缁煎悎鐩戞祴璁惧淇℃伅", list);
+/**
+ * 澶勭悊鍦板舰鍥惧眰
+ */
+function handleTerrainLayer(checked) {
+ if (checked) {
+ initTerrainLayer();
+ toggleLayerVisible("鍦板舰鏁版嵁", true);
+ } else {
+ const layer = treeMap.get("鍦板舰鏁版嵁");
+ if (layer) {
+ toggleLayerVisible("鍦板舰鏁版嵁", false);
+ layer.removeFromMap();
+ treeMap.delete("鍦板舰鏁版嵁");
+ }
+ }
}
-const districtList = ref([]);
-const getDistrictList = async () => {
- await getDistrictListData().then((res) => {
- districtList.value = res.data;
- })
-};
-async function initDistrictPoint() {
- let list = [];
- await getDistrictList()
- districtList.value.forEach((item) => {
- item.showBillboard = true;
- item.className = "district";
- item.type = "娉ョ煶娴�";
- const entity = createPoint(item);
- entity.show = false;
- list.push(entity);
- });
- treeMap.set("瀛欒儭娌熼殣鎮ｇ偣", list);
+/**
+ * 澶勭悊褰卞儚鍥惧眰
+ */
+function handleImageryLayer(checked) {
+ if (checked) {
+ initImageryLayer();
+ toggleLayerVisible("褰卞儚鏁版嵁", true);
+ } else {
+ const layer = treeMap.get("褰卞儚鏁版嵁");
+ if (layer) {
+ toggleLayerVisible("褰卞儚鏁版嵁", false);
+ layer.removeFromMap();
+ treeMap.delete("褰卞儚鏁版嵁");
+ }
+ }
}
-let divPointList = [];
+/**
+ * 澶勭悊妯″瀷鍥惧眰
+ */
+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, 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();
+}
+
+/**
+ * 娓呴櫎鍥惧眰瀹炰綋
+ * @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 == "瀛欒儭娌熼殣鎮ｇ偣") {
+// 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 === "瀛欒儭娌熼殣鎮ｇ偣") {
+ 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("瀛欒儭娌熼殣鎮ｇ偣");
+
+ 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("瀛欒儭娌熼殣鎮ｇ偣", 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;
- const divPoint = earthCtrl.factory.createDivPoint(
- item.alias,
- { lon: longitude, lat: latitude },
- {
- type: "custom",
- offset: ["c", 60],
- description: `
- <div class="divPoint-custom">
- <p>${item.alias}</p>
- </div>
- `,
- near: 0,
- far: 500000,
- }
- );
- divPoint.item.show = false;
- console.log(divPoint);
-
- divPointList.push(divPoint.item);
+ return entity;
});
treeMap.set("瀛欒儭娌熸柇闈�", list);
});
}
-function addTetrahedron(visible) {
- const emergencyAreaList = [];
- // 杩欓噷鏄坊鍔犻伩闄╃偣搴曞眰闈㈢墖
- loadAreaPolygon("/json/emergency_area.geojson", true).then((entities) => {
- emergencyAreaList.push(...entities);
- });
- // console.log('polygon', polygon);
-
- let list = [
- {
- name: "灏瑰缓鍗庡",
- longitude: 116.593517,
- latitude: 40.568391,
- altitude: 528.45,
- },
- // {
- // name: "鑼冩尟姹熷",
- // longitude: 116.591059,
- // latitude: 40.574068,
- // altitude: 528,
- // },
- // {
- // name: "鍚庡潯",
- // longitude: 116.597975,
- // latitude: 40.558199,
- // altitude: 528,
- // },
- ];
- // 杩欓噷鏄坊鍔犻伩闄╃偣瀵屾枃鏈珮浜樉绀�
- list.forEach((item) => {
- let point = earthCtrl.factory.createRichTextPoint("閬块櫓鐐�", [item.longitude, item.latitude, item.altitude - 10], {
- distanceDisplayCondition: new SmartEarth.Cesium.DistanceDisplayCondition(0, 2000),
- fontColor: "#ffffff",
- fontSize: 20
- }, "0");
- console.log("point", point);
- emergencyAreaList.push(point);
- });
- treeMap.set("閬块櫓鐐�", emergencyAreaList);
-}
-function toggleLayerVisible(name, checked) {
- const entityList = treeMap.get(name);
-
- console.log(`Toggling visibility for ${name}:`, checked);
-
- if (Array.isArray(entityList)) {
- entityList.forEach((entity) => {
- console.log(`Setting entity show to:`, checked);
- entity.show = checked;
+/**
+ * 娣诲姞閬块櫓鍦烘墍鏁版嵁
+ */
+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);
});
- } else if (entityList && typeof entityList.show !== 'undefined') {
- console.log(`Setting layer show to:`, checked);
- entityList.show = checked;
- } else {
- console.error(`鏃犳硶璁剧疆鍥惧眰 ${name} 鐨勫彲瑙佹�);
- }
+ });
}
-function getData() {
- initDevicePoint();
- initDistrictPoint();
+/**
+ * 鍒濆鍖栨墍鏈夋暟鎹�
+ */
+function initData() {
initDuanmianPoint();
+ addTetrahedron();
}
-// 閫氳繃 store 浼犻�掗渶瑕侀�変腑鐨刱ey
+// 鐩戝惉 store 涓殑 checkedKeys 鍙樺寲
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]);
}
}
);
+// 鐩戝惉璺敱鍙樺寲
watch(
() => route.fullPath,
(path) => {
- const defaultKeys = defaultSelectedKeys.value;
- if (path == "/yhgl") {
- treeRef.value.setCheckedKeys(defaultKeys.concat("瀛欒儭娌熼殣鎮ｇ偣"), true);
- toggleLayerVisible("瀛欒儭娌熼殣鎮ｇ偣", true);
- toggleLayerVisible("缁煎悎鐩戞祴璁惧淇℃伅", false);
- toggleLayerVisible("瀛欒儭娌熸柇闈�", false);
- } else if (path == "/zhjc") {
- treeRef.value.setCheckedKeys(
- defaultKeys.concat("缁煎悎鐩戞祴璁惧淇℃伅"),
- true
- );
- toggleLayerVisible("缁煎悎鐩戞祴璁惧淇℃伅", true);
- toggleLayerVisible("瀛欒儭娌熼殣鎮ｇ偣", false);
- toggleLayerVisible("瀛欒儭娌熸柇闈�", false);
- } else if (path == "/mnfz") {
- treeRef.value.setCheckedKeys(
- defaultKeys.concat("瀛欒儭娌熸柇闈�"),
- false
- );
- toggleLayerVisible("瀛欒儭娌熸柇闈�", false);
- toggleLayerVisible("瀛欒儭娌熼殣鎮ｇ偣", false);
- toggleLayerVisible("缁煎悎鐩戞祴璁惧淇℃伅", false);
- } else {
- treeRef.value.setCheckedKeys(defaultKeys, true);
- }
- }
+ const defaultKeys = [...defaultSelectedKeys.value];
+ const checkedKeys =
+ {
+ // 椤甸潰榛樿鍕鹃�夋樉绀哄湪姝ゅ
+ "/yhgl": [...defaultKeys, "瀛欒儭娌熼殣鎮ｇ偣"],
+ "/zhjc": [...defaultKeys, "缁煎悎鐩戞祴璁惧淇℃伅"],
+ // "/mnfz": [...defaultKeys, "瀛欒儭娌熸柇闈�"],
+ }[path] || defaultKeys;
+
+ treeRef.value?.setCheckedKeys(checkedKeys);
+ },
+ { immediate: true }
);
+
+// 缁勪欢鎸傝浇鏃跺垵濮嬪寲
onMounted(() => {
- initMap();
- getData();
+ initTerrainLayer();
+ initData();
+ nextTick(() => {
+ 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 {
- // position: absolute;
- // top: 11%;
- // right: 25%;
background: url("@/assets/img/tools/plotting_new.png");
width: 200px;
- height: 200px;
z-index: 99;
+ overflow: hidden;
+
+ :deep(.el-tree) {
+ overflow: hidden !important;
+ }
}
</style>
--
Gitblit v1.9.3