彭宇 преди 2 години
родител
ревизия
994f4f7bad
променени са 2 файла, в които са добавени 256 реда и са изтрити 249 реда
  1. 254 246
      src/components/supermap.vue
  2. 2 3
      src/views/leader.vue

+ 254 - 246
src/components/supermap.vue

@@ -6,23 +6,23 @@
   import 'leaflet-side-by-side'
   import '@supermap/iclient-leaflet'
   import 'leaflet/dist/leaflet.css'
-  import 'leaflet.markercluster/dist/leaflet.markercluster-src.js';
-  import 'leaflet.markercluster/dist/MarkerCluster.css';
-  import 'leaflet.markercluster/dist/MarkerCluster.Default.css';
-  import 'leaflet-draw';
+  import 'leaflet.markercluster/dist/leaflet.markercluster-src.js'
+  import 'leaflet.markercluster/dist/MarkerCluster.css'
+  import 'leaflet.markercluster/dist/MarkerCluster.Default.css'
+  import 'leaflet-draw'
   import 'leaflet-draw/dist/leaflet.draw.css'
 
   import L from 'leaflet'
 
-  import {getSuperMap, iconList} from '@/api/components/supermap.js'
+  import { getSuperMap, iconList } from '@/api/components/supermap.js'
   // import {setToken} from '../plugins/auth'
   import modal from '@/plugins/modal'
 
   export default {
-    name: "sookaSuperMap",
+    name: 'sookaSuperMap',
     data() {
       return {
-        mapDivId: "",
+        mapDivId: '',
         map: null,
         layers: [],
         isAggregationLayers: [],
@@ -36,15 +36,15 @@
         latLngGroup: [],
         isEditableLayers: false,//绘图控件
         drawControl: null,//绘图控件
-        deckglLayer : null,//图层Layer
+        deckglLayer: null//图层Layer
       }
     },
     watch: {
       isEditableLayers: {
-        handler (newValue, oldValue) {
+        handler(newValue, oldValue) {
           if (newValue) {
-            var editableLayers = new window.L.FeatureGroup();
-            this.map.addLayer(editableLayers);
+            var editableLayers = new window.L.FeatureGroup()
+            this.map.addLayer(editableLayers)
             let options = {
               position: 'topleft',
               draw: {
@@ -59,52 +59,52 @@
                 featureGroup: editableLayers,
                 remove: true
               }
-            };
-            this.drawControl = new window.L.Control.Draw(options);
-            this.map.addControl(this.drawControl);
-            this.map.on(window.L.Draw.Event.CREATED, function (e) {
-              let editableLayer = e.layer;
-              let layerType = e.layerType;
-              editableLayer.on('dblclick', function (e) {
-                if (layerType === "polygon"||layerType === "rectangle") {
-                  let latlng = editableLayer.getLatLngs()[0];
+            }
+            this.drawControl = new window.L.Control.Draw(options)
+            this.map.addControl(this.drawControl)
+            this.map.on(window.L.Draw.Event.CREATED, function(e) {
+              let editableLayer = e.layer
+              let layerType = e.layerType
+              editableLayer.on('dblclick', function(e) {
+                if (layerType === 'polygon' || layerType === 'rectangle') {
+                  let latlng = editableLayer.getLatLngs()[0]
                   //一个自定义的计算面积的函数
-                  var seeArea = window.L.GeometryUtil.geodesicArea(latlng);
-                  let area = (seeArea / 10e5).toFixed(2) + "k㎡";
-                  modal.msg(area);
-                } else if (layerType === "polyline") {
-                  let latlng = editableLayer.getLatLngs();
+                  var seeArea = window.L.GeometryUtil.geodesicArea(latlng)
+                  let area = (seeArea / 10e5).toFixed(2) + 'k㎡'
+                  modal.msg(area)
+                } else if (layerType === 'polyline') {
+                  let latlng = editableLayer.getLatLngs()
                   //一个自定义的计算长度的函数
-                  let dis = 0;
+                  let dis = 0
                   for (let i = 0; i < latlng.length - 1; i++) {
-                    let start = latlng[i];
-                    let end = latlng[i + 1];
-                    dis += window.L.latLng([start.lat, start.lng]).distanceTo([end.lat, end.lng]);//计算两个点之间的距离,并累加
+                    let start = latlng[i]
+                    let end = latlng[i + 1]
+                    dis += window.L.latLng([start.lat, start.lng]).distanceTo([end.lat, end.lng])//计算两个点之间的距离,并累加
                   }
                   //结果得到的也是number类型,单位是KM
-                  modal.msg((dis / 10e2).toFixed(2) + "km");
+                  modal.msg((dis / 10e2).toFixed(2) + 'km')
                 }
               })
-              if(layerType === "marker"){
+              if (layerType === 'marker') {
                 let icon = new window.L.Icon({
                   iconUrl: iconList['marker'],
                   iconSize: [48, 48],
                   iconAnchor: [24, 40],
                   popupAnchor: [-3, -40],
-                  shadowSize: [41, 41],
+                  shadowSize: [41, 41]
                 })
-                editableLayer.options.icon=icon;
+                editableLayer.options.icon = icon
               }
-              editableLayers.addLayer(editableLayer);
-            });
-          }else{
-            this.map.removeControl(this.drawControl);
+              editableLayers.addLayer(editableLayer)
+            })
+          } else {
+            this.map.removeControl(this.drawControl)
           }
-        },
+        }
       }
     },
     mounted() {
-      this.initMap();
+      this.initMap()
       //添加画图的提示信息
       window.L.drawLocal.draw.toolbar = {
         actions: {
@@ -216,17 +216,17 @@
       isSideBySide: null,
       showLatLng: null,
       showAreaLatLng: null,
-      showLineLatLng: null,
+      showLineLatLng: null
     },
     methods: {
-      clearM: async function (isAggregation) {//清理地图标点
+      clearM: async function(isAggregation) {//清理地图标点
         if (isAggregation) {
           if (this.isAggregationMyGroup != undefined && this.isAggregationMyGroup != false) {
             this.isAggregationMyGroup.clearLayers()
           }
-          this.map.removeLayer(this.isAggregationLayers);
-          this.isAggregationLayers = [];
-          this.radiusLayers = [];
+          this.map.removeLayer(this.isAggregationLayers)
+          this.isAggregationLayers = []
+          this.radiusLayers = []
           this.isAggregationLayers = window.L.markerClusterGroup({
             //设置为true时显示聚类所占据的范围
             showCoverageOnHover: true,
@@ -235,8 +235,8 @@
             //增加点位时增加聚合动画(否则会出问题)
             animateAddingMarkers: true,
             //最大缩放级别点击聚合图标展开图标
-            spiderfyOnMaxZoom:true,
-          });
+            spiderfyOnMaxZoom: true
+          })
 
         } else {
           if (this.myGroup != undefined && this.myGroup != false) {
@@ -246,27 +246,29 @@
         }
 
       },
-      clearC: async function () {//清理地图画线
+      clearC: async function() {//清理地图画线
         if (this.connectLayer != undefined && this.connectLayer != false) {
-          this.connectLayer.clearLayers();
+          this.connectLayer.clearLayers()
         }
+        this.connectLayer = []
       },
-      clearG: async function () {//清理地图图形
+      clearG: async function() {//清理地图图形
         if (this.graphicsLayer != undefined && this.graphicsLayer != false) {
-          this.graphicsLayer.clearLayers();
+          this.graphicsLayer.clearLayers()
         }
+        this.graphicsLayer = []
       },
-      clearP: async function () {//清理点击事件落点
+      clearP: async function() {//清理点击事件落点
         if (this.latLngGroup != undefined && this.latLngGroup != false) {
           this.latLngGroup.clearLayers()
         }
         this.latLngLayers = []
       },
-      initMap: function () {
-        let _that = this;
-        this.mapDivId = this.mapDiv;
-        let mapSite = this.mapSite;
-        let isSideBySide = this.isSideBySide;
+      initMap: function() {
+        let _that = this
+        this.mapDivId = this.mapDiv
+        let mapSite = this.mapSite
+        let isSideBySide = this.isSideBySide
         // setToken("eyJhbGciOiJIUzUxMiJ9.eyJ1c2VyX2lkIjoxLCJ1c2VyX2tleSI6ImY5Zjg3ZjVmLWQ4NTctNDQxZC04NmQ5LTg4OWExZWRlODE4ZSIsInVzZXJuYW1lIjoiYWRtaW4ifQ.26mAzmaM9pUza9585aLnRMyRd4GxvrWbCxN0erYsuiBDYQiYnyc-TwXVNDI7Xrpt3Bqmbnul-XMszOxYQi12LA");
         _that.isAggregationLayers = window.L.markerClusterGroup({
           //设置为true时显示聚类所占据的范围
@@ -276,26 +278,26 @@
           //增加点位时增加聚合动画(否则会出问题)
           animateAddingMarkers: true,
           //最大缩放级别点击聚合图标展开图标
-          spiderfyOnMaxZoom:true,
-        });
+          spiderfyOnMaxZoom: true
+        })
         if (!isSideBySide) {  //只有一个地图
           if (this.codes.length != 1) {
-            modal.msgError("请输入一个地图code!");
+            modal.msgError('请输入一个地图code!')
             return
           }
           getSuperMap(this.codes).then(resp => {
-            let mapList = resp.data;
+            let mapList = resp.data
             if (mapList != null && mapList.length > 0) {
-              let url = mapList[0].url;
-              let centerLat = mapList[0].centerLat;
-              let centerLng = mapList[0].centerLng;
-              let zoom = mapList[0].zoom;  //默认比例
-              let maxZoom = mapList[0].maxZoom;  //最大比例
-              let minZoom = mapList[0].minZoom; //最小比例
-              let zoomControl = mapList[0].zoomControl == null ? true : mapList[0].zoomControl;  //地图缩放+-号是否显示
-              let attributionControl = mapList[0].attributionControl == null ? true : mapList[0].attributionControl; //logo是否显示
-              let logoControl = mapList[0].logoControl == null ? false : mapList[0].logoControl; //logo是否显示
-              let dragging = mapList[0].dragging == null ? true : mapList[0].dragging; //地图是否允许鼠标拖拽
+              let url = mapList[0].url
+              let centerLat = mapList[0].centerLat
+              let centerLng = mapList[0].centerLng
+              let zoom = mapList[0].zoom  //默认比例
+              let maxZoom = mapList[0].maxZoom  //最大比例
+              let minZoom = mapList[0].minZoom //最小比例
+              let zoomControl = mapList[0].zoomControl == null ? true : mapList[0].zoomControl  //地图缩放+-号是否显示
+              let attributionControl = mapList[0].attributionControl == null ? true : mapList[0].attributionControl //logo是否显示
+              let logoControl = mapList[0].logoControl == null ? false : mapList[0].logoControl //logo是否显示
+              let dragging = mapList[0].dragging == null ? true : mapList[0].dragging //地图是否允许鼠标拖拽
 
               let defaultConfigure = {
                 crs: window.L.CRS.EPSG4326,
@@ -308,9 +310,9 @@
                 attributionControl: attributionControl,
                 dragging: dragging,
                 logoControl: logoControl
-              };
-              let loadConfiguration = Object.assign(defaultConfigure, mapSite);
-              this.map = window.L.map(this.mapDiv, loadConfiguration);
+              }
+              let loadConfiguration = Object.assign(defaultConfigure, mapSite)
+              this.map = window.L.map(this.mapDiv, loadConfiguration)
               //鼠标双击落点
               if (this.showLatLng != undefined) {
                 let icon = new window.L.Icon({
@@ -318,15 +320,15 @@
                   iconSize: [48, 48],
                   iconAnchor: [24, 40],
                   popupAnchor: [-3, -40],
-                  shadowSize: [41, 41],
+                  shadowSize: [41, 41]
                 })
 
-                this.map.on('dblclick', function (e) {
-                  _that.clearP();
-                  _that.showLatLng(e.latlng.lat, e.latlng.lng);
+                this.map.on('dblclick', function(e) {
+                  _that.clearP()
+                  _that.showLatLng(e.latlng.lat, e.latlng.lng)
                   let marker = window.L.marker([e.latlng.lat, e.latlng.lng], {
                     icon: icon
-                  }).addTo(this.map);
+                  }).addTo(this.map)
                   _that.latLngLayers.push(marker)
                   _that.latLngGroup = window.L.layerGroup(_that.latLngLayers)
                   this.map.addLayer(_that.latLngGroup)
@@ -334,8 +336,8 @@
               }
               //鼠标绘制区域
               if (this.showAreaLatLng != undefined) {
-                var editableLayers = new window.L.FeatureGroup();
-                this.map.addLayer(editableLayers);
+                var editableLayers = new window.L.FeatureGroup()
+                this.map.addLayer(editableLayers)
                 let options = {
                   position: 'topleft',
                   draw: {
@@ -351,25 +353,25 @@
                     featureGroup: editableLayers,
                     remove: true
                   }
-                };
-                var drawControl = new window.L.Control.Draw(options);
-                this.map.addControl(drawControl);
-                this.map.on(window.L.Draw.Event.CREATED, function (e) {
-                  let editableLayer = e.layer;
-                  let layerType = e.layerType;
-                  editableLayer.on('dblclick', function (e) {
-                    if (layerType === "polygon"||layerType === "rectangle") {
-                      let latlng = editableLayer.getLatLngs()[0];
+                }
+                var drawControl = new window.L.Control.Draw(options)
+                this.map.addControl(drawControl)
+                this.map.on(window.L.Draw.Event.CREATED, function(e) {
+                  let editableLayer = e.layer
+                  let layerType = e.layerType
+                  editableLayer.on('dblclick', function(e) {
+                    if (layerType === 'polygon' || layerType === 'rectangle') {
+                      let latlng = editableLayer.getLatLngs()[0]
                       _that.showAreaLatLng(latlng)
                     }
                   })
-                  editableLayers.addLayer(editableLayer);
-                });
+                  editableLayers.addLayer(editableLayer)
+                })
               }
               //鼠标绘制线段
               if (this.showLineLatLng != undefined) {
-                var editableLayers = new window.L.FeatureGroup();
-                this.map.addLayer(editableLayers);
+                var editableLayers = new window.L.FeatureGroup()
+                this.map.addLayer(editableLayers)
                 let options = {
                   position: 'topleft',
                   draw: {
@@ -385,43 +387,43 @@
                     featureGroup: editableLayers,
                     remove: true
                   }
-                };
-                var drawControl = new window.L.Control.Draw(options);
-                this.map.addControl(drawControl);
-                this.map.on(window.L.Draw.Event.CREATED, function (e) {
-                  let editableLayer = e.layer;
-                  let layerType = e.layerType;
-                  editableLayer.on('dblclick', function (e) {
-                     if (layerType === "polyline") {
-                      let latlng = editableLayer.getLatLngs();
+                }
+                var drawControl = new window.L.Control.Draw(options)
+                this.map.addControl(drawControl)
+                this.map.on(window.L.Draw.Event.CREATED, function(e) {
+                  let editableLayer = e.layer
+                  let layerType = e.layerType
+                  editableLayer.on('dblclick', function(e) {
+                    if (layerType === 'polyline') {
+                      let latlng = editableLayer.getLatLngs()
                       _that.showLineLatLng(latlng)
                     }
                   })
-                  editableLayers.addLayer(editableLayer);
-                });
+                  editableLayers.addLayer(editableLayer)
+                })
               }
-              window.L.supermap.tiledMapLayer(url).addTo(this.map);
+              window.L.supermap.tiledMapLayer(url).addTo(this.map)
             }
           })
         } else {  //卷帘地图
           if (this.codes.length != 2) {
-            modal.msgError("请输入两个地图code!");
+            modal.msgError('请输入两个地图code!')
             return
           }
           getSuperMap(this.codes).then(resp => {
-            let mapList = resp.data;
+            let mapList = resp.data
             if (mapList != null && mapList.length == 2) {
-              let stamenurl = mapList[0].url;
-              let osmurl = mapList[1].url;
-              let centerLat = mapList[0].centerLat;
-              let centerLng = mapList[0].centerLng;
-              let zoom = mapList[0].zoom;  //默认比例
-              let maxZoom = mapList[0].maxZoom;  //最大比例
-              let minZoom = mapList[0].minZoom; //最小比例
-              let zoomControl = mapList[0].zoomControl == null ? true : mapList[0].zoomControl;  //地图缩放+-号是否显示
-              let attributionControl = mapList[0].attributionControl == null ? true : mapList[0].attributionControl; //logo是否显示
-              let logoControl = mapList[0].logoControl == null ? false : mapList[0].logoControl; //logo是否显示
-              let dragging = mapList[0].dragging == null ? true : mapList[0].dragging; //地图是否允许鼠标拖拽
+              let stamenurl = mapList[0].url
+              let osmurl = mapList[1].url
+              let centerLat = mapList[0].centerLat
+              let centerLng = mapList[0].centerLng
+              let zoom = mapList[0].zoom  //默认比例
+              let maxZoom = mapList[0].maxZoom  //最大比例
+              let minZoom = mapList[0].minZoom //最小比例
+              let zoomControl = mapList[0].zoomControl == null ? true : mapList[0].zoomControl  //地图缩放+-号是否显示
+              let attributionControl = mapList[0].attributionControl == null ? true : mapList[0].attributionControl //logo是否显示
+              let logoControl = mapList[0].logoControl == null ? false : mapList[0].logoControl //logo是否显示
+              let dragging = mapList[0].dragging == null ? true : mapList[0].dragging //地图是否允许鼠标拖拽
 
               let defaultConfigure = {
                 crs: window.L.CRS.EPSG4326,
@@ -434,10 +436,10 @@
                 attributionControl: attributionControl,
                 dragging: dragging,
                 logoControl: logoControl
-              };
+              }
 
-              let loadConfiguration = Object.assign(defaultConfigure, mapSite);
-              this.map = window.L.map(this.mapDiv, loadConfiguration);
+              let loadConfiguration = Object.assign(defaultConfigure, mapSite)
+              this.map = window.L.map(this.mapDiv, loadConfiguration)
               //鼠标双击落点
               if (this.showLatLng != undefined) {
                 let icon = new window.L.Icon({
@@ -445,15 +447,15 @@
                   iconSize: [48, 48],
                   iconAnchor: [24, 40],
                   popupAnchor: [-3, -40],
-                  shadowSize: [41, 41],
+                  shadowSize: [41, 41]
                 })
 
-                this.map.on('dblclick', function (e) {
-                  _that.clearP();
-                  _that.showLatLng(e.latlng.lat, e.latlng.lng);
+                this.map.on('dblclick', function(e) {
+                  _that.clearP()
+                  _that.showLatLng(e.latlng.lat, e.latlng.lng)
                   let marker = window.L.marker([e.latlng.lat, e.latlng.lng], {
                     icon: icon
-                  }).addTo(this.map);
+                  }).addTo(this.map)
                   _that.latLngLayers.push(marker)
                   _that.latLngGroup = window.L.layerGroup(_that.latLngLayers)
                   this.map.addLayer(_that.latLngGroup)
@@ -461,8 +463,8 @@
               }
               //鼠标绘制区域
               if (this.showAreaLatLng != undefined) {
-                var editableLayers = new window.L.FeatureGroup();
-                this.map.addLayer(editableLayers);
+                var editableLayers = new window.L.FeatureGroup()
+                this.map.addLayer(editableLayers)
                 let options = {
                   position: 'topleft',
                   draw: {
@@ -478,25 +480,25 @@
                     featureGroup: editableLayers,
                     remove: true
                   }
-                };
-                var drawControl = new window.L.Control.Draw(options);
-                this.map.addControl(drawControl);
-                this.map.on(window.L.Draw.Event.CREATED, function (e) {
-                  let editableLayer = e.layer;
-                  let layerType = e.layerType;
-                  editableLayer.on('dblclick', function (e) {
-                    if (layerType === "polygon"||layerType === "rectangle") {
-                      let latlng = editableLayer.getLatLngs()[0];
+                }
+                var drawControl = new window.L.Control.Draw(options)
+                this.map.addControl(drawControl)
+                this.map.on(window.L.Draw.Event.CREATED, function(e) {
+                  let editableLayer = e.layer
+                  let layerType = e.layerType
+                  editableLayer.on('dblclick', function(e) {
+                    if (layerType === 'polygon' || layerType === 'rectangle') {
+                      let latlng = editableLayer.getLatLngs()[0]
                       _that.showAreaLatLng(latlng)
                     }
                   })
-                  editableLayers.addLayer(editableLayer);
-                });
+                  editableLayers.addLayer(editableLayer)
+                })
               }
               //鼠标绘制线段
               if (this.showLineLatLng != undefined) {
-                var editableLayers = new window.L.FeatureGroup();
-                this.map.addLayer(editableLayers);
+                var editableLayers = new window.L.FeatureGroup()
+                this.map.addLayer(editableLayers)
                 let options = {
                   position: 'topleft',
                   draw: {
@@ -512,25 +514,25 @@
                     featureGroup: editableLayers,
                     remove: true
                   }
-                };
-                var drawControl = new window.L.Control.Draw(options);
-                this.map.addControl(drawControl);
-                this.map.on(window.L.Draw.Event.CREATED, function (e) {
-                  let editableLayer = e.layer;
-                  let layerType = e.layerType;
-                  editableLayer.on('dblclick', function (e) {
-                    if (layerType === "polyline") {
-                      let latlng = editableLayer.getLatLngs();
+                }
+                var drawControl = new window.L.Control.Draw(options)
+                this.map.addControl(drawControl)
+                this.map.on(window.L.Draw.Event.CREATED, function(e) {
+                  let editableLayer = e.layer
+                  let layerType = e.layerType
+                  editableLayer.on('dblclick', function(e) {
+                    if (layerType === 'polyline') {
+                      let latlng = editableLayer.getLatLngs()
                       _that.showLineLatLng(latlng)
                     }
                   })
-                  editableLayers.addLayer(editableLayer);
-                });
+                  editableLayers.addLayer(editableLayer)
+                })
               }
 
-              let stamenLayer = window.L.supermap.tiledMapLayer(stamenurl).addTo(this.map);
-              let osmLayer = window.L.supermap.tiledMapLayer(osmurl).addTo(this.map);
-              L.control.sideBySide(stamenLayer, osmLayer).addTo(this.map);
+              let stamenLayer = window.L.supermap.tiledMapLayer(stamenurl).addTo(this.map)
+              let osmLayer = window.L.supermap.tiledMapLayer(osmurl).addTo(this.map)
+              L.control.sideBySide(stamenLayer, osmLayer).addTo(this.map)
             }
           })
         }
@@ -539,76 +541,76 @@
       /**
        * polygon [{lat:30,lng:104},{lat:30,lng:104},{lat:30,lng:104}]
        */
-      formatArea: function (polygon) {
+      formatArea: function(polygon) {
         //L.GeometryUtil.geodesicArea(),返回number类型的数据,单位是平方米,这里做了一下转化
-        var seeArea = window.L.GeometryUtil.geodesicArea(polygon);
-        let area = (seeArea / 10e5).toFixed(2) + "k㎡";
-        return area;
+        var seeArea = window.L.GeometryUtil.geodesicArea(polygon)
+        let area = (seeArea / 10e5).toFixed(2) + 'k㎡'
+        return area
       },
       // 获取长度
       /**
        * line[{lat:30,lng:104},{lat:30,lng:104},{lat:30,lng:104}]
        */
-      formatLength: function (line) {
-        let dis = 0;
+      formatLength: function(line) {
+        let dis = 0
         for (let i = 0; i < line.length - 1; i++) {
-          let start = line[i];
-          let end = line[i + 1];
-          dis += window.L.latLng([start.lat, start.lng]).distanceTo([end.lat, end.lng]);//计算两个点之间的距离,并累加
+          let start = line[i]
+          let end = line[i + 1]
+          dis += window.L.latLng([start.lat, start.lng]).distanceTo([end.lat, end.lng])//计算两个点之间的距离,并累加
         }
         //结果得到的也是number类型,单位是 米
-        return (dis / 10e2).toFixed(2) + "km";
+        return (dis / 10e2).toFixed(2) + 'km'
       },
-      setMarkers: function (markersList) {//地图标点
-        const _that = this;
+      setMarkers: function(markersList) {//地图标点
+        const _that = this
         for (let i = 0; i < markersList.length; i++) {
-          let isAggregation = markersList[i].isAggregation == null ? false : markersList[i].isAggregation;  //是否聚合点位
-          let keepBindPopup = isAggregation == true ? false : markersList[i].keepBindPopup;  //提示气泡是否一直显示
+          let isAggregation = markersList[i].isAggregation == null ? false : markersList[i].isAggregation  //是否聚合点位
+          let keepBindPopup = isAggregation == true ? false : markersList[i].keepBindPopup  //提示气泡是否一直显示
 
           let icon = new window.L.Icon({
             iconUrl: iconList[markersList[i].icon],
             iconSize: [48, 48],
             iconAnchor: [24, 40],
             popupAnchor: [-3, -40],
-            shadowSize: [41, 41],
+            shadowSize: [41, 41]
           })
           let markerClick = window.L.marker([markersList[i].lat, markersList[i].lng], {
             icon: icon
-          }).addTo(this.map);
-          if (markersList[i].bindPopupHtml != null && markersList[i].bindPopupHtml !== "") {
-            let html = markersList[i].bindPopupHtml;
+          }).addTo(this.map)
+          if (markersList[i].bindPopupHtml != null && markersList[i].bindPopupHtml !== '') {
+            let html = markersList[i].bindPopupHtml
             if (keepBindPopup) {
               markerClick.bindPopup(html, {
                 autoClose: false,
                 closeOnClick: null,
                 closeButton: false
-              }).openPopup(markerClick.getLatLng());
+              }).openPopup(markerClick.getLatLng())
             } else {
-              markerClick.on('mouseover', function () {
-                let html = markersList[i].bindPopupHtml;
-                this.bindPopup(html).openPopup(this.getLatLng());
-              }).on('mouseout', function () {
-                this.closePopup();
+              markerClick.on('mouseover', function() {
+                let html = markersList[i].bindPopupHtml
+                this.bindPopup(html).openPopup(this.getLatLng())
+              }).on('mouseout', function() {
+                this.closePopup()
               })
             }
           }
-          if (markersList[i].click != null && markersList[i].click !== "") {
-            if(markersList[i].parameter != null && markersList[i].parameter !== ""){
-              markerClick.on('click', function () {
-                let clickName = markersList[i].click;
-                _that.$emit(clickName,markersList[i].parameter);
+          if (markersList[i].click != null && markersList[i].click !== '') {
+            if (markersList[i].parameter != null && markersList[i].parameter !== '') {
+              markerClick.on('click', function() {
+                let clickName = markersList[i].click
+                _that.$emit(clickName, markersList[i].parameter)
               })
-            }else{
-              markerClick.on('click', function () {
-                let clickName = markersList[i].click;
-                _that.$emit(clickName);
+            } else {
+              markerClick.on('click', function() {
+                let clickName = markersList[i].click
+                _that.$emit(clickName)
               })
             }
           }
           if (isAggregation) {
             _that.isAggregationLayers.addLayer(markerClick)
             _that.isAggregationMyGroup = window.L.layerGroup(_that.isAggregationLayers)
-            this.map.addLayer(_that.isAggregationLayers);
+            this.map.addLayer(_that.isAggregationLayers)
           } else {
             _that.layers.push(markerClick)
             _that.myGroup = window.L.layerGroup(_that.layers)
@@ -617,110 +619,116 @@
 
         }
       },
-      setMarkersRadius: function (markersList) {//地图标点带范围
-        const _that = this;
+      setMarkersRadius: function(markersList) {//地图标点带范围
+        const _that = this
         for (let i = 0; i < markersList.length; i++) {
-          let isAggregation = markersList[i].isAggregation == null ? false : markersList[i].isAggregation;  //是否聚合点位
-          let keepBindPopup = isAggregation == true ? false : markersList[i].keepBindPopup;  //提示气泡是否一直显示
+          let isAggregation = markersList[i].isAggregation == null ? false : markersList[i].isAggregation  //是否聚合点位
+          let keepBindPopup = isAggregation == true ? false : markersList[i].keepBindPopup  //提示气泡是否一直显示
 
-          _that.polygon = window.L.circle([markersList[i].lat, markersList[i].lng], {radius: markersList[i].radius * 1000});
+          _that.polygon = window.L.circle([markersList[i].lat, markersList[i].lng], { radius: markersList[i].radius * 1000 })
           let icon = new window.L.Icon({//传感器
             iconUrl: iconList[markersList[i].icon],
             iconSize: [48, 48],
             iconAnchor: [24, 40],
             popupAnchor: [-3, -40],
-            shadowSize: [41, 41],
+            shadowSize: [41, 41]
           })
           let marker = window.L.marker([markersList[i].lat, markersList[i].lng], {
             icon: icon
-          });
-          if (markersList[i].bindPopupHtml != null && markersList[i].bindPopupHtml !== "") {
-            let html = markersList[i].bindPopupHtml;
+          })
+          if (markersList[i].bindPopupHtml != null && markersList[i].bindPopupHtml !== '') {
+            let html = markersList[i].bindPopupHtml
             if (keepBindPopup) {
               marker.bindPopup(html, {
                 autoClose: false,
                 closeOnClick: null,
                 closeButton: false
-              }).openPopup(marker.getLatLng());
+              }).openPopup(marker.getLatLng())
             } else {
-              marker.on('mouseover', function () {
-                let html = markersList[i].bindPopupHtml;
-                this.bindPopup(html).openPopup(this.getLatLng());
-              }).on('mouseout', function () {
-                this.closePopup();
+              marker.on('mouseover', function() {
+                let html = markersList[i].bindPopupHtml
+                this.bindPopup(html).openPopup(this.getLatLng())
+              }).on('mouseout', function() {
+                this.closePopup()
               })
             }
           }
-          if (markersList[i].click != null && markersList[i].click != "") {
-            if(markersList[i].parameter != null && markersList[i].parameter !== ""){
-              marker.on('click', function () {
-                let clickName = markersList[i].click;
-                _that.$emit(clickName,markersList[i].parameter);
+          if (markersList[i].click != null && markersList[i].click != '') {
+            if (markersList[i].parameter != null && markersList[i].parameter !== '') {
+              marker.on('click', function() {
+                let clickName = markersList[i].click
+                _that.$emit(clickName, markersList[i].parameter)
               })
-            }else{
-              marker.on('click', function () {
-                let clickName = markersList[i].click;
-                _that.$emit(clickName);
+            } else {
+              marker.on('click', function() {
+                let clickName = markersList[i].click
+                _that.$emit(clickName)
               })
             }
           }
-          marker.addTo(this.map);
-
+          marker.addTo(this.map)
 
           if (isAggregation) {
-            _that.isAggregationLayers.addLayer(marker);
-            _that.radiusLayers.push(_that.polygon);
-            this.map.addLayer(_that.isAggregationLayers);
+            _that.isAggregationLayers.addLayer(marker)
+            _that.radiusLayers.push(_that.polygon)
+            this.map.addLayer(_that.isAggregationLayers)
             _that.isAggregationMyGroup = window.L.layerGroup(_that.radiusLayers)
             this.map.addLayer(_that.isAggregationMyGroup)
           } else {
-            _that.layers.push(marker);
-            _that.layers.push(_that.polygon);
+            _that.layers.push(marker)
+            _that.layers.push(_that.polygon)
             _that.myGroup = window.L.layerGroup(_that.layers)
             this.map.addLayer(_that.myGroup)
           }
         }
       },
-      setConnectList: function (connectList, color) {//地图画线
-        const _that = this;
-        let points = [];
+      setConnectList: function(connectList, color) {//地图画线
+        const _that = this
+        let points = []
         for (let i = 0; i < connectList.length; i++) {
-          points.push([connectList[i].lat, connectList[i].lng]);//创建点
+          points.push([connectList[i].lat, connectList[i].lng])//创建点
+        }
+        let polyline = window.L.polyline(points, { color: color })
+        if (this.connectLayer != undefined && this.connectLayer != false) {
+          _that.connectLayer.addLayer(polyline)
+        } else {
+          _that.connectLayer = window.L.featureGroup().addTo(this.map)
+          _that.connectLayer.addLayer(polyline)
         }
-        let polyline = window.L.polyline(points, {color: color});
-        _that.connectLayer = window.L.featureGroup().addTo(this.map);
-        _that.connectLayer.addLayer(polyline);
       },
-      setGraphicsList: function (graphicsList, color) {//地图图形
-        const _that = this;
-        let points = [];
+      setGraphicsList: function(graphicsList, color) {//地图图形
+        const _that = this
+        let points = []
         for (let i = 0; i < graphicsList.length; i++) {
-          points.push([graphicsList[i].lat, graphicsList[i].lng]);//创建点
+          points.push([graphicsList[i].lat, graphicsList[i].lng])//创建点
+        }
+        let polygon = window.L.polygon(points, { color: color })
+        polygon.addTo(this.map)
+        if (this.graphicsLayer != undefined && this.graphicsLayer != false) {
+          _that.graphicsLayer.addLayer(polygon)
+        } else {
+          _that.graphicsLayer = window.L.featureGroup().addTo(this.map)
+          _that.graphicsLayer.addLayer(polygon)
         }
-        let polygon = window.L.polygon(points, {color: color});
-        polygon.addTo(this.map);
-        _that.graphicsLayer = window.L.featureGroup().addTo(this.map);
-        _that.graphicsLayer.addLayer(polygon);
       },
-      dropLocation: function (lat, lng) {//落点定位
+      dropLocation: function(lat, lng) {//落点定位
         this.controlLevel(10)
         setTimeout(() => {
-          this.map.panTo([lat, lng]);
-        },500)
+          this.map.panTo([lat, lng])
+        }, 500)
       },
-      controlLevel: function (level) {//控制地图缩放级别
+      controlLevel: function(level) {//控制地图缩放级别
         this.map.setZoom(level)
       },
-      layerSwitching: function (url,isClear) {//图层切换  url 图层地址   isClear  是否清除图层
-        if(isClear){
-          if(this.deckglLayer!=null){
+      layerSwitching: function(url, isClear) {//图层切换  url 图层地址   isClear  是否清除图层
+        if (isClear) {
+          if (this.deckglLayer != null) {
             this.deckglLayer.remove()
           }
         }
-        this.deckglLayer = window.L.supermap.tiledMapLayer(url,{
-        });
-        this.map.addLayer(this.deckglLayer);
-      },
+        this.deckglLayer = window.L.supermap.tiledMapLayer(url, {})
+        this.map.addLayer(this.deckglLayer)
+      }
     }
   }
 </script>

+ 2 - 3
src/views/leader.vue

@@ -179,6 +179,8 @@
         getForestLeader(linJob,linType).then(res => {
           this.peopleList=res.data
         })
+        this.connectList=[]
+        this.$refs.supermap.clearC();
       },
       //点击左侧人员列表获取轨迹
       getLeaderTrack(userId) {
@@ -207,10 +209,7 @@
         this.connectList=[]
         if(points!=null&&points!=""){
           this.connectList=JSON.parse(points);
-          this.$refs.supermap.clearC()
           this.$refs.supermap.setConnectList(this.connectList, 'red')
-        }else{
-          this.$refs.supermap.clearC()
         }
       },