修改样式

zhsq_qk-ui/src/views/supermap/supermap.vue

@@ -269,17 +269,17 @@ export default {
         icon: icon
       });
       //定义泡泡层
-      marker.on('click', function () {
+      marker.on('mouseover', function () {
         let html = "";
         html += "<p class='v-p-color'>摄像头名称：" + option.cameraName + "</p>";
         html += "<p class='v-p-color'>摄像头类型：" + option.buildTypeName + "</p>";
         html += "<p class='v-p-color'>所属派出所：" + option.policeName + "</p>";
         this.bindPopup(html).openPopup(this.getLatLng());
       });
-      // /**鼠标移开关闭popup**/
-      // marker.on('mouseout', function () {
-      //   this.closePopup();
-      // });
+      /**鼠标移开关闭popup**/
+      marker.on('mouseout', function () {
+        this.closePopup();
+      });
 
       return marker;
     },
@@ -375,9 +375,6 @@ export default {
           that.myLayerGroup.splice(i, 1)
         }
       }
-      // if (that.resultLayer != null) {
-      //   that.resultLayer.clearLayers()
-      // }
     },
     //查询摄像头落点列表
     selectCameraList() {
@@ -419,190 +416,6 @@ export default {
         this.suppliesOpen = true
       })
     },
-    // addCameraMark: function (options) {
-    //   //创建聚散图层并添加layers
-    //   let marker = [];
-    //   this.resultLayer = L.markerClusterGroup({
-    //     showCoverageOnHover: false,
-    //     zoomToBoundsOnClick: true,
-    //     animateAddingMarkers: true,
-    //     spiderfyOnMaxZoom: true
-    //   });
-    //   options.data.forEach(e => {
-    //     var lat = e.latitude;
-    //     var lon = e.longitude;
-    //     var buildType = e.buildType;
-    //     var markpoint = e.markpoint;
-    //     var myIcon = L.icon({
-    //       iconUrl: getIcon(buildType),
-    //       iconAnchor: [50, 50],
-    //       iconSize: [37, 64],
-    //       popupAnchor: [-33, -47],
-    //       shadowSize: [41, 41],
-    //     });
-    //     marker = L.marker([lat, lon], {
-    //       icon: myIcon
-    //     });
-    //     marker.bindPopup(markpoint);
-    //     this.resultLayer.addLayer(marker);
-    //     /**鼠标悬停打开popup**/
-    //     marker.on('mouseover', function () {
-    //       let html = "";
-    //       html += "<p class='v-p-color'>摄像头名称：" + e.cameraName + "</p>";
-    //       html += "<p class='v-p-color'>摄像头类型：" + e.buildTypeName + "</p>";
-    //       html += "<p class='v-p-color'>所属派出所：" + e.policeName + "</p>";
-    //       this.bindPopup(html).openPopup(this.getLatLng());
-    //     });
-    //     // /**鼠标移开关闭popup**/
-    //     marker.on('mouseout', function () {
-    //       this.closePopup();
-    //     });
-    //   })
-    //   this.resultLayer.addTo(this.map)
-    // },
-    //
-    // //查询抢险救援队落点列表
-    // selectQkEmergencyRescueTeamAllList() {
-    //   selectQkEmergencyRescueTeamAllList().then(response => {
-    //     this.addTeamMark(response);
-    //   })
-    // },
-    // addTeamMark: function (options) {
-    //   //创建聚散图层并添加layers
-    //   let that = this;
-    //   let marker = [];
-    //   that.resultLayer = L.markerClusterGroup({
-    //     showCoverageOnHover: false,
-    //     zoomToBoundsOnClick: true,
-    //     animateAddingMarkers: true,
-    //     spiderfyOnMaxZoom: true
-    //   });
-    //   options.data.forEach(e => {
-    //     var lat = e.latitude;
-    //     var lon = e.longitude;
-    //     var myIcon = L.icon({
-    //       iconUrl: require('@/assets/images/cameraType/yjdw.png'),
-    //       iconAnchor: [50, 50],
-    //       iconSize: [37, 64],
-    //       popupAnchor: [-33, -47],
-    //       shadowSize: [41, 41],
-    //     });
-    //     marker = L.marker([lat, lon], {
-    //       icon: myIcon
-    //     });
-    //     that.resultLayer.addLayer(marker);
-    //     /**鼠标悬停打开popup**/
-    //     marker.on('click', function () {
-    //       that.suppliesOpen = false
-    //       that.selectQkEmergencyRescueTeamByDeptId(e.deptId)
-    //     });
-    //
-    //   })
-    //   that.resultLayer.addTo(that.map)
-    // },
-    // selectQkEmergencyRescueTeamByDeptId(deptId) {
-    //   selectQkEmergencyRescueTeamByDeptId(deptId).then(res => {
-    //     this.teamData = res.data;
-    //     this.teamOpen = true
-    //
-    //   })
-    // },
-    // // //查询应急避难所落点列表
-    // // selectQkEmergencyShelterAllList() {
-    // //   selectQkEmergencyShelterAllList().then(response => {
-    // //     this.addShelterMark(response)
-    // //   })
-    // // },
-    // addShelterMark: function (options) {
-    //   //创建聚散图层并添加layers
-    //   let marker = [];
-    //   this.resultLayer = L.markerClusterGroup({
-    //     showCoverageOnHover: false,
-    //     zoomToBoundsOnClick: true,
-    //     animateAddingMarkers: true,
-    //     spiderfyOnMaxZoom: true
-    //   });
-    //   options.data.forEach(e => {
-    //     var lat = e.latitude;
-    //     var lon = e.longitude;
-    //     var markpoint = e.markpoint;
-    //     var myIcon = L.icon({
-    //       iconUrl: require('@/assets/images/cameraType/yjcs.png'),
-    //       iconAnchor: [50, 50],
-    //       iconSize: [37, 64],
-    //       popupAnchor: [-33, -47],
-    //       shadowSize: [41, 41],
-    //     });
-    //     marker = L.marker([lat, lon], {
-    //       icon: myIcon
-    //     });
-    //     marker.bindPopup(markpoint);
-    //     this.resultLayer.addLayer(marker);
-    //     /**鼠标悬停打开popup**/
-    //     marker.on('click', function () {
-    //       let html = "";
-    //       html += "<p class='v-p-color'>避难场所名称：" + e.name + "</p>";
-    //       html += "<p class='v-p-color'>类型：" + e.type + "</p>";
-    //       html += "<p class='v-p-color'>地址：" + e.address + "</p>";
-    //       html += "<p class='v-p-color'>避难场所范围：" + e.range + "</p>";
-    //       html += "<p class='v-p-color'>避难场所现状描述：" + e.state + "</p>";
-    //       html += "<p class='v-p-color'>占地面积（m²）：" + e.area + "</p>";
-    //       html += "<p class='v-p-color'>可转移安置人数（万人)：" + e.transferPerson + "</p>";
-    //       html += "<p class='v-p-color'>建设内容：" + e.constructionContent + "</p>";
-    //       this.bindPopup(html).openPopup(this.getLatLng());
-    //     });
-    //     // /**鼠标移开关闭popup**/
-    //     marker.on('dblclick', function () {
-    //       this.closePopup();
-    //     });
-    //   })
-    //   this.resultLayer.addTo(this.map)
-    // },
-    //
-    // //查询防汛抗旱物资储备落点列表
-    // selectQkRescueSuppliesAllList() {
-    //   selectQkRescueSuppliesAllList().then(response => {
-    //     this.addSuppliesMark(response);
-    //   })
-    // },
-    // addSuppliesMark: function (options) {
-    //   //创建聚散图层并添加layers
-    //   let that = this;
-    //   let marker = [];
-    //   that.resultLayer = L.markerClusterGroup({
-    //     showCoverageOnHover: false,
-    //     zoomToBoundsOnClick: true,
-    //     animateAddingMarkers: true,
-    //     spiderfyOnMaxZoom: true
-    //   });
-    //   options.data.forEach(e => {
-    //     var lat = e.latitude;
-    //     var lon = e.longitude;
-    //     var myIcon = L.icon({
-    //       iconUrl: require('@/assets/images/cameraType/khwz.png'),
-    //       iconAnchor: [50, 50],
-    //       iconSize: [37, 64],
-    //       popupAnchor: [-33, -47],
-    //       shadowSize: [41, 41],
-    //     });
-    //     marker = L.marker([lat, lon], {
-    //       icon: myIcon
-    //     });
-    //     that.resultLayer.addLayer(marker);
-    //     /**鼠标悬停打开popup**/
-    //     marker.on('click', function () {
-    //       that.teamOpen = false
-    //       that.selectQkRescueSuppliesByDeptId(e.deptId)
-    //     });
-    //   })
-    //   that.resultLayer.addTo(that.map)
-    // },
-    // selectQkRescueSuppliesByDeptId(deptId) {
-    //   selectQkRescueSuppliesByDeptId(deptId).then(res => {
-    //     this.suppliesData = res.data;
-    //     this.suppliesOpen = true
-    //   })
-    // },
   }
 }
 
@@ -688,7 +501,8 @@ td {
 		}
 		.leaflet-popup-content {
 		    margin: 13px 19px;
-		    line-height: 1.4;
+		    line-height: 1.4;
+        width: 298px!important;
 		}
 		.leaflet-popup-content p {
 		    margin: 18px 0;
@@ -719,8 +533,7 @@ td {
 		.leaflet-popup-tip {
 		    background: rgba(4, 45, 106, 0.7);
 		    color: #333;
-		    box-shadow: 0 3px 14px rgba(0,0,0,0.4);
-        width: 298px;
+		    box-shadow: 0 3px 14px rgba(0,0,0,0.4);
 		}
 		.leaflet-container a.leaflet-popup-close-button {
 		    position: absolute;