更版地图

ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/BMapContainer/index.vue

@@ -41,6 +41,7 @@ export default {
     // );
     // Vue.prototype.map2d = this.$refs.gisMap2d;
     Vue.prototype.mapIns = this.$refs.gisMap2d;
+    Vue.prototype.mapInsOpenLayers = []
     this.$emit("update:isGisCompleted", true);
   },
   methods: {

ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/HomeVector/index.vue

@@ -28,13 +28,20 @@ export default {
   },
   created() {
     this.activeIcon = window.showStakeText ? 'Vector' : null;
-    Vue.prototype.mapIns.pileIsShow("jhlayers", false);
+    if(Vue.prototype.isMapStatck && Vue.prototype.mapIns && Vue.prototype.mapInsOpenLayers &&  Vue.prototype.mapInsOpenLayers.length > 0){
+      for(let i of Vue.prototype.mapInsOpenLayers){
+        Vue.prototype.mapIns.pileIsShow(i, Vue.prototype.isMapStatck);
+      }
+    }
+    // Vue.prototype.mapIns.pileIsShow("jhlayers", false);
   },
   methods: {
     handleClick(type) {
       this.activeIcon = this.activeIcon === type ? null : type;
       Vue.prototype.isMapStatck = (this.activeIcon === type);
-      Vue.prototype.mapIns.pileIsShow("jhlayers", (this.activeIcon === type));
+      for(let i of Vue.prototype.mapInsOpenLayers){
+        Vue.prototype.mapIns.pileIsShow(i, (this.activeIcon === type));
+      }
       if (this.activeIcon) window.showStakeText = true;
       else window.showStakeText = false;
       // markerClusterIns.setData();

ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/RoadAndEvents/utils/map.js

@@ -45,6 +45,7 @@ export class MarkerCluster {
   infoWindow;
   mapContainer;
   data = []; //标注集合
+  dataInfo = {};
   vroot;
   constructor() {}
 
@@ -54,7 +55,7 @@ export class MarkerCluster {
 
   async addData(_id, _data, isDefault) {
     this.infoWindow?.close?.();
-
+    Vue.prototype.mapInsOpenLayers.push(_id)
     //data.forEach(e => {
     //  const lnglat = getLnglat(e.extData);
     //  e.extData.longitude = lnglat[0];//点坐标经度    【必传字段】
@@ -114,6 +115,7 @@ export class MarkerCluster {
         })
       }
     })
+    this.dataInfo[_id] = _data;
     this.data.push(..._data);
     if(aryPoints.length > 0){      
       map2d.addPointByArr(
@@ -122,20 +124,25 @@ export class MarkerCluster {
         true    //  当前新加图层是否启用聚合效果
      );
      console.log(aryPoints,_id,'点位数组')
-    } else {
-      Vue.prototype.mapIns.removeLayerByName(_id);
     }
-    // if(Vue.prototype.isMapStatck){
+    if(Vue.prototype.isMapStatck){
-    //   setTimeout(() => {
+      setTimeout(() => {
-    //     Vue.prototype.mapIns.pileIsShow("jhlayers", true);  
+        Vue.prototype.mapIns.pileIsShow(_id, true);  
-    //   }, 500);
+      }, 500);
-    // }
+    }
-  }
-  removeLayer(id){
-    Vue.prototype.mapIns.removeLayerByName(id);
   }
-
   removeData(_id, _data) {
+      if (!_data) return;
+      if (!Array.isArray(data)) data = [_data];
+    const _vpmIndex = Vue.prototype.mapInsOpenLayers.findIndex(_id);
+    if(_vpmIndex !== -1){
+      Vue.prototype.mapInsOpenLayers.splice(_vpmIndex)
+    }      
+    
+    const _dataTemp = [];
+    if(this.dataInfo[_id]){
+      _dataTemp = this.dataInfo[_id]
+    }
     _data.forEach((item, index) => {
       const findIndex = this.data.findIndex(
         (removeData) => removeData === item
@@ -162,13 +169,20 @@ export class MarkerCluster {
         }
       }
       if (findIndex > -1) this.data.splice(findIndex, 1);
+
+      const _findIndex = _dataTemp.findIndex(
+        (removeData) => removeData === item
+      );
+      if (_findIndex > -1) {
+        _dataTemp.splice(_findIndex, 1);
+      }
     });
     console.log('remove',_id,_data)
     Vue.prototype.mapIns.removeLayerByName(_id);
-    if(_data && Array.isArray(_data) && _data.length > 0){
+    if(_dataTemp.length > 0){
       const self = this;
       setTimeout(() => {
-        self.refreshLayer(_id, _data);  
+        self.refreshLayer(_id, _dataTemp);  
       }, 500);
     }