首页底图缩放调整

public/static/config/config.js

@@ -14,7 +14,7 @@ var systemConfig = {
   assetsUrl: "http://localhost:2013",
   mapViewer: {
     center: [31.14785322514787, 121.50195320451814],
-    zoom: 1,
+    zoom: 2,
   },
   terrainMap: {
     url: "http://aimap.pudong.sh:5236/zjmap/reproduction-service/maps/rest/services/dlg-fullcolor/proxy?AccessKey=lUaEMxqqhZKLSImGuP/Ergx47orYVyIqHVgxfyGpIurKAy9kdq5uU1cWuTuIXeOM",
@@ -51,25 +51,28 @@ var systemConfig = {
   imageryLayer: {
     crs: "",
     url: "http://aimap.pudong.sh:5236/zjmap/reproduction-service/maps/rest/services/air-2022/proxy?AccessKey=lUaEMxqqhZKLSImGuP/Ergx47orYVyIqHVgxfyGpIurKAy9kdq5uU1cWuTuIXeOM",
+    // 行政区域 -- 村居
+    // url: "http://aimap.pudong.sh:5236/zjmap/reproduction-service/maps/rest/services/admin-pudong-sh2k-neighborhood/mapserver?AccessKey=lUaEMxqqhZKLSImGuP/Ergx47orYVyIqHVgxfyGpIurKAy9kdq5uU1cWuTuIXeOM",
+
     // 按照宝石蓝底图分辨率
-    // resolutions: [
-    //   529.1666666666666,264.5833333333333,132.29166666666666, 52.916666666666664, 26.458333333333332,
-    //   13.229166666666666, 5.291666666666666, 2.645833333333333,
-    //   1.3229166666666665, 0.5291666666666666, 0.2645833333333333,
-    //   0.13229166666666664,
-    // ],
-    // //
-    //529.167725002116, 264.583862501058
-    // 按照测绘院分辨率虚拟的
     resolutions: [
-      132.2919312505292, 52.91677250021167, 26.458386250105836,
-      13.229193125052918, 5.291677250021167, 2.6458386250105836,
-      1.3229193125052918, 0.5291677250021167, 0.26458386250105836,
-      0.13229193125052918, 0.0529167725002, 0.0264583862501, 0.0132291931251,
-      0.00529167725, 0.002645838625, 0.0013229193125,
+      529.1666666666666,264.5833333333333,132.29166666666666, 52.916666666666664, 26.458333333333332,
+      13.229166666666666, 5.291666666666666, 2.645833333333333,
+      1.3229166666666665, 0.5291666666666666, 0.2645833333333333,
+      0.13229166666666664,
     ],
-    // minZoom: 0,
-    // maxZoom: 14,
+    //
+    //529.167725002116, 264.583862501058
+    // 按照测绘院分辨率虚拟的
+    // resolutions: [
+    //   132.2919312505292, 52.91677250021167, 26.458386250105836,
+    //   13.229193125052918, 5.291677250021167, 2.6458386250105836,
+    //   1.3229193125052918, 0.5291677250021167, 0.26458386250105836,
+    //   0.13229193125052918, 0.0529167725002, 0.0264583862501, 0.0132291931251,
+    //   0.00529167725, 0.002645838625, 0.0013229193125,
+    // ],
+    minZoom: 0,
+    maxZoom: 14,
   },
   imageryLayerSat2022s2: {
     crs: "",

src/components/map/MapHolder.vue

@@ -1,10 +1,24 @@
 <template>
   <div id="map2DViewer">
     <!-- 特殊地图属性弹窗 -- 有审计功能 -->
-    <CaseAuditPopup v-show="auditPopupShow" :tableObj="auditRefTableObj" :defaultStatus="defaultStatus" ref="auditRef" />
+    <CaseAuditPopup
+      v-show="auditPopupShow"
+      :tableObj="auditRefTableObj"
+      :defaultStatus="defaultStatus"
+      ref="auditRef"
+    />
     <!-- 通用地图属性弹窗 -- 无审计功能 -->
-    <NormalAttrPopup v-show="normalAttrPopupShow" :tableObj="tableObj" ref="normalRef" />
-    <LabelCasePopup v-show="labelDetailsPopupShow" ref="labelRef" :targetArea="targetArea" :targetDistance="targetDistance" />
+    <NormalAttrPopup
+      v-show="normalAttrPopupShow"
+      :tableObj="tableObj"
+      ref="normalRef"
+    />
+    <LabelCasePopup
+      v-show="labelDetailsPopupShow"
+      ref="labelRef"
+      :targetArea="targetArea"
+      :targetDistance="targetDistance"
+    />
   </div>
 </template>
 <script>
@@ -19,7 +33,7 @@ export default {
   components: {
     CaseAuditPopup,
     NormalAttrPopup,
-    LabelCasePopup
+    LabelCasePopup,
   },
   data() {
     return {
@@ -47,17 +61,17 @@ export default {
         镇域名称: "--",
         "面积(平方米)": "--",
         土地类型: "--",
-        图斑编号: "--"
+        图斑编号: "--",
       },
       auditRefTableObj: {
         镇域名称: "--",
         "面积(平方米)": "--",
         图层构成: "--",
-        性质: "--"
+        性质: "--",
       },
       targetArea: 0,
       targetDistance: 0,
-      defaultStatus: "未标记"
+      defaultStatus: "未标记",
     };
   },
   created() {},
@@ -90,7 +104,7 @@ export default {
       deleteGroupFromMap: this.deleteGroupFromMap,
       drawGeometry: this.drawGeometry,
       deleteGeometry: this.deleteGeometry,
-      addTiledMapLayer: this.addTiledMapLayer
+      addTiledMapLayer: this.addTiledMapLayer,
     });
   },
   beforeDestroyed() {
@@ -111,7 +125,7 @@ export default {
     // 监听当前菜单
     getCurrentMenu() {
       return this.$store.state.navSelect;
-    }
+    },
   },
   watch: {
     getLabelCaseBtnStatus(val) {
@@ -152,9 +166,9 @@ export default {
         this.$nextTick(() => {
           this.getJSonData();
         });
-      }
+      },
       // immediate: true
-    }
+    },
   },
   methods: {
     // 测试宝石蓝底图
@@ -165,7 +179,7 @@ export default {
         minZoom: 0,
         minNativeZoom: 3,
         maxNativeZoom: 7,
-        maxZoom: 14
+        maxZoom: 14,
       });
       return layer;
     },
@@ -177,7 +191,7 @@ export default {
         minZoom: 0,
         minNativeZoom: 0,
         maxNativeZoom: 7,
-        maxZoom: 14
+        maxZoom: 14,
       });
       return layer;
     },
@@ -189,7 +203,7 @@ export default {
     stopLabelCase() {
       if (map2DViewer.measureTool) {
         map2DViewer.setDrawTool({
-          action: "remove"
+          action: "remove",
         });
       }
     },
@@ -220,13 +234,13 @@ export default {
             if ($(`#${str}_id a`)) {
               $(`#${str}_id a`)
                 .eq(0)
-                .click(e => {
+                .click((e) => {
                   this.$store.state.lawPopupShow = true;
                   this.$store.state.lawSourceType = sourceType;
                 });
               $(`#${str}_id a`)
                 .eq(1)
-                .click(e => {
+                .click((e) => {
                   // 触发综合分析右侧面板点击事件
                   this.$bus.$emit("viewDetailsPopup", geojsonData);
                 });
@@ -239,7 +253,7 @@ export default {
               $(`#${str}_id a`).eq(0).remove();
               $(`#${str}_id a`)
                 .eq(0)
-                .click(e => {
+                .click((e) => {
                   // 触发综合分析右侧面板点击事件
                   this.$bus.$emit("viewDetailsPopup", geojsonData);
                 });
@@ -287,11 +301,17 @@ export default {
           // 下拉框内容
           if ($(`#${str}_id .center-table-item-special select`)) {
             if (this.caseStatusMap.has(str)) {
-              $(`#${str}_id .center-table-item-special select`).val(this.caseStatusMap.get(str));
+              $(`#${str}_id .center-table-item-special select`).val(
+                this.caseStatusMap.get(str)
+              );
               let inputStatus = "";
               if (this.caseStatusMap.has(str)) {
-                this.caseStatusMap.get(str) === "isTrue" && $(`#${str}_id .center-table-item-special input`).val("疑点");
-                !this.caseStatusMap.get(str) === "isTrue" && $(`#${str}_id .center-table-item-special input`).val("非疑点");
+                this.caseStatusMap.get(str) === "isTrue" &&
+                  $(`#${str}_id .center-table-item-special input`).val("疑点");
+                !this.caseStatusMap.get(str) === "isTrue" &&
+                  $(`#${str}_id .center-table-item-special input`).val(
+                    "非疑点"
+                  );
               }
             }
           }
@@ -300,13 +320,13 @@ export default {
           if ($(`#${str}_id a`)) {
             $(`#${str}_id a`)
               .eq(0)
-              .click(e => {
+              .click((e) => {
                 this.$store.state.lawPopupShow = true;
                 this.$store.state.lawSourceType = sourceType;
               });
             $(`#${str}_id a`)
               .eq(1)
-              .click(e => {
+              .click((e) => {
                 // 触发综合分析右侧面板点击事件
 
                 this.$bus.$emit("viewDetailsPopup", geojsonData);
@@ -314,7 +334,7 @@ export default {
           }
           // input添加点击事件
           if ($(`#${str}_id input`)[1]) {
-            $(`#${str}_id input`).click(e => {
+            $(`#${str}_id input`).click((e) => {
               switch (e.target.defaultValue) {
                 case "取消":
                   this.cancelBtnEvent();
@@ -348,7 +368,7 @@ export default {
         div.innerHTML = this.currentLabelHtml;
         $(() => {
           $(`#${str}_id`).css("height", "100%");
-          $(`#${str}_id input`).click(e => {
+          $(`#${str}_id input`).click((e) => {
             switch (e.target.defaultValue) {
               case "取消":
                 this.cancelBtnEvent();
@@ -369,12 +389,12 @@ export default {
       if (selectVal === "isTrue") {
         map2DViewer.polygons[str].setStyle({
           color: `rgb(${caseColorChange["isPointColor"][0]},${caseColorChange["isPointColor"][1]},${caseColorChange["isPointColor"][2]})`,
-          weight: 4
+          weight: 4,
         });
       } else {
         map2DViewer.polygons[str].setStyle({
           color: `rgb(${caseColorChange["notPointColor"][0]},${caseColorChange["notPointColor"][1]},${caseColorChange["notPointColor"][2]})`,
-          weight: 4
+          weight: 4,
         });
       }
       // 修改疑点时必须要写id
@@ -385,32 +405,42 @@ export default {
         // 修改人员名称
         c_editor_name: localStorage.getItem("USER_NAME"),
         // 修改人员ID
-        c_editorid: localStorage.getItem("USER_ID")
+        c_editorid: localStorage.getItem("USER_ID"),
       };
 
       let modifyParams = new FormData();
       modifyParams = {
         columnId: columnId,
         modelId: modelId,
-        content: JSON.stringify(obj)
+        content: JSON.stringify(obj),
       };
-      this.$Post(this.urlsCollection.updateContent, modifyParams).then(res => {
-        if (res.code === 200) {
-          this.$message.success("数据修改成功");
-          map2DViewer.map.closePopup();
+      this.$Post(this.urlsCollection.updateContent, modifyParams).then(
+        (res) => {
+          if (res.code === 200) {
+            this.$message.success("数据修改成功");
+            map2DViewer.map.closePopup();
 
-          switch (selectVal) {
-            case "isTrue":
-              this.$store.state.mapMethodsCollection.get("METHODS").changeCaseBoolean(str, "疑点");
-              this.$store.state.mapMethodsCollection.get("METHODS").changeSortMethod("疑点");
-              break;
-            case "isFalse":
-              this.$store.state.mapMethodsCollection.get("METHODS").changeCaseBoolean(str, "非疑点");
-              this.$store.state.mapMethodsCollection.get("METHODS").changeSortMethod("非疑点");
-              break;
+            switch (selectVal) {
+              case "isTrue":
+                this.$store.state.mapMethodsCollection
+                  .get("METHODS")
+                  .changeCaseBoolean(str, "疑点");
+                this.$store.state.mapMethodsCollection
+                  .get("METHODS")
+                  .changeSortMethod("疑点");
+                break;
+              case "isFalse":
+                this.$store.state.mapMethodsCollection
+                  .get("METHODS")
+                  .changeCaseBoolean(str, "非疑点");
+                this.$store.state.mapMethodsCollection
+                  .get("METHODS")
+                  .changeSortMethod("非疑点");
+                break;
+            }
           }
         }
-      });
+      );
     },
     cancelBtnEvent() {
       map2DViewer.map.closePopup();
@@ -445,7 +475,7 @@ export default {
             coordinates: coordinates,
             geoName: geoName,
             area: area,
-            distance: distance
+            distance: distance,
           };
           let geometry = publicFun.generateGeoJSON(options);
           let params = new FormData();
@@ -455,11 +485,11 @@ export default {
             geojson: newGeojson,
             type: geoType,
             userId: Number(localStorage.getItem("USER_ID")),
-            sourceId: 0
+            sourceId: 0,
           };
 
           this.$Post(this.urlsCollection.addConllection, params).then(
-            res => {
+            (res) => {
               if (res.code == 200) {
                 // 标记成功后删除保存的原有名称
                 myLabelNameMap.delete(geoName);
@@ -469,33 +499,36 @@ export default {
                 paramData = {
                   userId: Number(localStorage.getItem("USER_ID")),
                   sourceId: 0,
-                  pageSize: 10
+                  pageSize: 10,
                 };
                 // 暂存map中刚刚保存的数据
-                this.$Post(this.urlsCollection.selectByUser, paramData).then(userRes => {
-                  if (userRes.code === 200) {
-                    if (userRes.content.length > 0) {
-                      this.$store.state.myLabelPointsArr = [];
-                      this.$store.state.myLabelPointsArr = userRes.content.map(v => {
-                        if (JSON.stringify(geometry) === v.geojson) {
-                          sessionStorage.setItem("myLabelPointsId", v.id);
-                        }
-                        return {
-                          id: v.id,
-                          geojson: v.geojson,
-                          type: v.type
-                        };
-                      });
-                      // 判断刚刚暂存的数据，并调用小眼睛的方法
+                this.$Post(this.urlsCollection.selectByUser, paramData).then(
+                  (userRes) => {
+                    if (userRes.code === 200) {
+                      if (userRes.content.length > 0) {
+                        this.$store.state.myLabelPointsArr = [];
+                        this.$store.state.myLabelPointsArr =
+                          userRes.content.map((v) => {
+                            if (JSON.stringify(geometry) === v.geojson) {
+                              sessionStorage.setItem("myLabelPointsId", v.id);
+                            }
+                            return {
+                              id: v.id,
+                              geojson: v.geojson,
+                              type: v.type,
+                            };
+                          });
+                        // 判断刚刚暂存的数据，并调用小眼睛的方法
+                      }
                     }
+                    // 更新时调用一次搜索接口
                   }
-                  // 更新时调用一次搜索接口
-                });
+                );
               }
               // 保存后需要删除地图上的标记
               this.reStartLabelCase();
             },
-            error => {
+            (error) => {
               console.log("标记疑点保存失败！", error);
               this.reStartLabelCase();
             }
@@ -511,12 +544,18 @@ export default {
         //   "http://t0.tianditu.gov.cn/DataServer?T=img_w&X={x}&Y={y}&L={z}&tk=f331ba0b9ab96fb21c56d91de868935d"
         // ).addTo(map2DViewer.map);
         if (this.$store.state.JLControlRightMapUrl) {
-          map2DViewer.jlMap = this.addTiledMapLayer(this.$store.state.JLControlRightMapUrl).addTo(map2DViewer.map);
+          map2DViewer.jlMap = this.addTiledMapLayer(
+            this.$store.state.JLControlRightMapUrl
+          ).addTo(map2DViewer.map);
         } else {
-          map2DViewer.jlMap = this.addTiledMapLayer(systemConfig.imageryLayerSat2022s2.url).addTo(map2DViewer.map);
+          map2DViewer.jlMap = this.addTiledMapLayer(
+            systemConfig.imageryLayerSat2022s2.url
+          ).addTo(map2DViewer.map);
         }
 
-        map2DViewer.jlControl = L.control.sideBySide(map2DViewer.map, map2DViewer.jlMap).addTo(map2DViewer.map);
+        map2DViewer.jlControl = L.control
+          .sideBySide(map2DViewer.map, map2DViewer.jlMap)
+          .addTo(map2DViewer.map);
       } else if (map2DViewer.map.hasLayer(map2DViewer.jlMap)) {
         map2DViewer.map.removeControl(map2DViewer.jlControl);
         map2DViewer.map.removeLayer(map2DViewer.jlMap);
@@ -554,7 +593,7 @@ export default {
     initDraw() {
       if (!map2DViewer.measureTool) {
         // 引入疑点标记绘制方法
-        map2DViewer.drawToolFire = data => {
+        map2DViewer.drawToolFire = (data) => {
           // 纬经度
           if (data && data.points.length >= 1) {
             let geoType = null;
@@ -584,7 +623,16 @@ export default {
                 this.labelDetailsPopupShow = true;
                 this.labelPopup = L.popup({ maxWidth: 700, maxHeight: 600 })
                   .setLatLng(newCoord)
-                  .setContent(this.createLabelDiv("label", coord, data, geoType, data.area, data.distance))
+                  .setContent(
+                    this.createLabelDiv(
+                      "label",
+                      coord,
+                      data,
+                      geoType,
+                      data.area,
+                      data.distance
+                    )
+                  )
                   .openOn(map2DViewer.map);
                 this.labelDetailsPopupShow = false;
               });
@@ -599,7 +647,7 @@ export default {
           font_size: "14px",
           closeButton: true,
           iconUrl: "../../static/plugins/draw-plugin/images/marker-icon.png",
-          map: map2DViewer.map
+          map: map2DViewer.map,
         });
       }
     },
@@ -612,23 +660,25 @@ export default {
         {
           resolutions: systemConfig.imageryLayer.resolutions,
           origin: [-66000, 75000],
-          bounds: L.bounds([-65000, -76000], [75000, 72000])
+          bounds: L.bounds([-65000, -76000], [75000, 72000]),
         }
       );
 
       map2DViewer.map = L.map("map2DViewer", {
         crs: crs,
-        zoom: 0,
+        zoom: 2,
         minZoom: systemConfig.imageryLayer.minZoom,
         maxZoom: systemConfig.imageryLayer.maxZoom,
         attributionControl: false,
-        zoomControl: false
+        zoomControl: false,
         // preferCanvas: true,
       }).setView(systemConfig.mapViewer.center, systemConfig.mapViewer.zoom);
 
       //添加默认图层
       let guid = publicFun.buildGuid("baseLayer");
-      let layer = this.addTiledMapLayer(systemConfig.blueBlackMap.url).addTo(map2DViewer.map);
+      let layer = this.addTiledMapLayer(systemConfig.blueBlackMap.url).addTo(
+        map2DViewer.map
+      );
       map2DViewer.layers["darkmap"] = layer;
 
       let imageryLayer = this.addTiledMapLayer(systemConfig.imageryLayer.url);
@@ -651,14 +701,16 @@ export default {
         map2DViewer.groups["浦东新区_polygon"].remove();
       }
       // 请求并渲染新的区域图层
-      get("./static/json/simplified_pdgeojson.json", "").then(geoJson => {
+      get("./static/json/simplified_pdgeojson.json", "").then((geoJson) => {
         // 存放所有的面数据
         map2DViewer.groups["浦东新区_polygon"] = L.featureGroup();
         map2DViewer.groups["浦东新区_label"] = L.featureGroup();
         map2DViewer.groups["浦东新区_polygon"].addTo(map2DViewer.map);
         map2DViewer.groups["浦东新区_label"].addTo(map2DViewer.map);
-        geoJson.features.map(feature => {
-          let correctCordArr = JSON.parse(JSON.stringify(feature.geometry.coordinates));
+        geoJson.features.map((feature) => {
+          let correctCordArr = JSON.parse(
+            JSON.stringify(feature.geometry.coordinates)
+          );
           let newCorrectCoordArr = publicFun.latLngsCorrection(correctCordArr);
           feature.geometry.coordinates = newCorrectCoordArr;
           // if (
@@ -699,7 +751,10 @@ export default {
         this.getJSonDataToStreet("", "");
         // 切换到首页时需定位到当前图层
         if (this.$store.state.homeSpecialTown === "全部") {
-          this.setView(townLocationMap.get(this.$store.state.homeSpecialTown), 0);
+          this.setView(
+            townLocationMap.get(this.$store.state.homeSpecialTown),
+            3
+          );
         } else {
           let polygon = townPolygonMap.get(this.$store.state.homeSpecialTown);
           map2DViewer.map.fitBounds(polygon.getBounds());
@@ -718,7 +773,17 @@ export default {
       map2DViewer.map.setView(center, zoom);
     },
     renderPolygon: function (feature) {
-      let center = turf.centroid(feature.geometry);
+      let center;
+      if (
+        feature.properties.NAME.indexOf("南汇新城镇") > -1 ||
+        feature.properties.NAME.indexOf("高行镇") > -1 ||
+        feature.properties.NAME.indexOf("宣桥镇") > -1 ||
+        feature.properties.NAME.indexOf("康桥镇") > -1
+      ) {
+        center = turf.centerOfMass(feature.geometry);
+      } else {
+        center = turf.centroid(feature.geometry);
+      }
       // let itemvalue = JSON.parse((Math.random() * 1000).toFixed(0));
       let name = feature.properties.NAME;
 
@@ -730,7 +795,7 @@ export default {
         weight: 3,
         fillColor: this.getColor(name),
         opacity: 1,
-        fillOpacity: 0.4
+        fillOpacity: 0.4,
       }).addTo(map2DViewer.groups["浦东新区_polygon"]);
 
       center = JSON.parse(JSON.stringify(center)).geometry.coordinates;
@@ -743,25 +808,25 @@ export default {
           radius: 10,
           weight: 1,
           fillOpacity: 0,
-          color: "#e6d273"
+          color: "#e6d273",
         });
         wmarker.bindLabel(feature.properties.NAME, {
           noHide: true,
           clickable: true,
-          offset: [-25, 10]
+          offset: [-25, 10],
         });
         wmarker.addTo(map2DViewer.groups["浦东新区_label"]);
         let circle1 = L.circleMarker(center, {
           radius: 8,
           weight: 1,
           fillOpacity: 0,
-          color: "#e6d273"
+          color: "#e6d273",
         }).addTo(map2DViewer.groups["浦东新区_polygon"]);
         let circle2 = L.circleMarker(center, {
           radius: 5,
           weight: 1,
           fillOpacity: 1,
-          color: "#e6d273"
+          color: "#e6d273",
         }).addTo(map2DViewer.groups["浦东新区_polygon"]);
       }
     },
@@ -800,20 +865,32 @@ export default {
      * @modelId -- modelId
      * @columnId -- columnId
      */
-    addSinglePolygon(geometry, cid, color, uniqueId, mainType, sourceType, defaultStatus, modelId, columnId) {
+    addSinglePolygon(
+      geometry,
+      cid,
+      color,
+      uniqueId,
+      mainType,
+      sourceType,
+      defaultStatus,
+      modelId,
+      columnId
+    ) {
       let uniqueIdList = [];
       if (this.$store.state.selectSelectDataMap["singlePolygon"][uniqueId]) {
-        uniqueIdList = this.$store.state.selectSelectDataMap["singlePolygon"][uniqueId];
+        uniqueIdList =
+          this.$store.state.selectSelectDataMap["singlePolygon"][uniqueId];
       }
 
       let singlePolygonItem = {
         uniqueId: uniqueId,
         geometry: geometry,
         cid: cid,
-        color: color
+        color: color,
       };
       uniqueIdList.push(singlePolygonItem);
-      this.$store.state.selectSelectDataMap["singlePolygon"][uniqueId] = uniqueIdList;
+      this.$store.state.selectSelectDataMap["singlePolygon"][uniqueId] =
+        uniqueIdList;
       // 当前数据坐标系为WGS84
       let targetGeometry = JSON.parse(geometry).geometry;
       // 预设模型与所有图层层级不同
@@ -824,36 +901,38 @@ export default {
         weight: 3,
         fillColor: color,
         opacity: 1,
-        fillOpacity: 0
+        fillOpacity: 0,
       }).addTo(map2DViewer.analysisGroups[uniqueId]);
 
-      polygon.on("click", e => {
+      polygon.on("click", (e) => {
         // 鼠标点击图版高亮提示逻辑
         // 首先恢复上一个图版
         if (
           this.$store.state.map2DViewerPolygonsCid.newCid &&
           map2DViewer.polygons[this.$store.state.map2DViewerPolygonsCid.newCid]
         ) {
-          map2DViewer.polygons[this.$store.state.map2DViewerPolygonsCid.newCid].setStyle({
+          map2DViewer.polygons[
+            this.$store.state.map2DViewerPolygonsCid.newCid
+          ].setStyle({
             color: this.$store.state.map2DViewerPolygonsCid.oldColor,
-            fillOpacity: 0
+            fillOpacity: 0,
           });
         }
         // 判断是否是重复点击，不是的话高亮，是的话不操作。
         if (cid != this.$store.state.map2DViewerPolygonsCid.newCid) {
           this.$store.state.map2DViewerPolygonsCid = {
             newCid: cid,
-            oldColor: color
+            oldColor: color,
           };
           polygon.setStyle({
             color: "red",
             fillColor: "red",
-            fillOpacity: 0.35
+            fillOpacity: 0.35,
           });
         } else {
           this.$store.state.map2DViewerPolygonsCid = {
             newCid: null,
-            oldColor: null
+            oldColor: null,
           };
         }
 
@@ -866,7 +945,7 @@ export default {
               镇域名称: geoProperties["镇域名称"] || "--",
               "面积(平方米)": geoProperties["面积"] || "--",
               图层构成: geoProperties["图层构成"] || "--",
-              性质: geoProperties["性质"] || "--"
+              性质: geoProperties["性质"] || "--",
             };
             this.defaultStatus = defaultStatus;
 
@@ -876,9 +955,17 @@ export default {
               this.currentSourceType = sourceType;
               this.currentModelId = modelId;
               this.currentColumnId = columnId;
-              let domItem = this.createAuditDiv(cid, geojsonData, sourceType, modelId, columnId);
+              let domItem = this.createAuditDiv(
+                cid,
+                geojsonData,
+                sourceType,
+                modelId,
+                columnId
+              );
               this.auditPopupShow = true;
-              this.popup = L.popup({ maxWidth: 700, maxHeight: 600 }).setLatLng(e.latlng).setContent(domItem);
+              this.popup = L.popup({ maxWidth: 700, maxHeight: 600 })
+                .setLatLng(e.latlng)
+                .setContent(domItem);
               this.auditPopupShow = false;
               this.popup.openOn(map2DViewer.map);
             });
@@ -888,13 +975,15 @@ export default {
               镇域名称: geoProperties["镇域名称"] || "--",
               "面积(平方米)": geoProperties["面积"] || "--",
               土地类型: geoProperties["土地类型"] || "--",
-              图斑编号: geoProperties["图斑编号"] || "--"
+              图斑编号: geoProperties["图斑编号"] || "--",
             };
 
             this.$refs.normalRef.$nextTick(() => {
               let domItem = this.createNormalDiv(cid, geojsonData, sourceType);
               this.normalAttrPopupShow = true;
-              this.normalPopup = L.popup({ maxWidth: 700, maxHeight: 600 }).setLatLng(e.latlng).setContent(domItem);
+              this.normalPopup = L.popup({ maxWidth: 700, maxHeight: 600 })
+                .setLatLng(e.latlng)
+                .setContent(domItem);
               this.normalAttrPopupShow = false;
               this.normalPopup.openOn(map2DViewer.map);
             });
@@ -915,7 +1004,7 @@ export default {
     },
     //综合分析 - 标记疑点 - 删除面
     deletePolygonLayer(layer) {
-      map2DViewer.polygons[layer].forEach(polygon => {
+      map2DViewer.polygons[layer].forEach((polygon) => {
         map2DViewer.map.removeLayer(polygon);
       });
     },
@@ -923,7 +1012,7 @@ export default {
     drawPoints(data) {
       if (!map2DViewer.myLabels[`label_${data.id}`]) {
         let point = L.marker(data.coord, {
-          opacity: 1
+          opacity: 1,
         }).addTo(map2DViewer.groups["我的标记图层组"]);
         map2DViewer.myLabels[`label_${data.id}`] = point;
       }
@@ -936,7 +1025,7 @@ export default {
           weight: 3,
           fillOpacity: color,
           opacity: 1,
-          fillOpacity: 0.4
+          fillOpacity: 0.4,
         }).addTo(map2DViewer.groups["我的标记图层组"]);
         // zoom the map to the polyline
         map2DViewer.myLabels[`label_${data.id}`] = polyline;
@@ -950,7 +1039,7 @@ export default {
           weight: 3,
           fillOpacity: color,
           opacity: 1,
-          fillOpacity: 0.4
+          fillOpacity: 0.4,
         }).addTo(map2DViewer.groups["我的标记图层组"]);
 
         map2DViewer.myLabels[`label_${data.id}`] = polygon;
@@ -972,7 +1061,7 @@ export default {
             fillOpacity: color,
             opacity: 1,
             fillOpacity: 0.4,
-            radius: Number(distance)
+            radius: Number(distance),
           }).addTo(map2DViewer.groups["我的标记图层组"]);
           map2DViewer.myLabels[`label_${data.id}`] = circle;
         }
@@ -1003,18 +1092,19 @@ export default {
       if (geometry) {
         geometry.removeFrom(map2DViewer.map);
       }
-    }
-  }
+    },
+  },
 };
 </script>
 <style lang="less" scoped>
 #map2DViewer {
   position: absolute;
-  width: 100%;
-  height: calc(100% - 60px);
+  width: 140%;
+  height: calc(142% - 2px);
   background-color: rgb(0, 47, 71);
   z-index: 1;
-  top: 60px;
-  left: 0px;
+  top: -170px;
+  left: -400px;
+  scale: 0.65;
 }
 </style>

src/views/ComprehensiveAnalysis.vue

@@ -78,7 +78,7 @@
       <div class="title">返回上级</div>
     </div>
     <div class="comprehensive-analysis-searchbox">
-      <el-input placeholder="请输入地名地址" v-model="addressInput">
+      <el-input placeholder="请输入地名地址"  clearable v-model="addressInput" style="background:rgba(0, 47, 86, 0.4);">
         <el-button
           type="primary"
           slot="append"
@@ -3101,7 +3101,7 @@ export default {
     border: 1px solid rgb(243, 237, 237, 0.6);
     padding: 5px;
     text-align: left;
-    background: rgba(0, 47, 86, 0.3);
+    background: rgba(0, 47, 86, 0.4);
     &-item {
       cursor: pointer;
       width: 100%;

src/views/HomeView.vue

@@ -343,7 +343,7 @@ export default {
     homeSelect(val) {
       this.$store.commit("changeHomeSpecialTown", val);
       if (val === "全部") {
-        this.$refs.mapLoaderRef.setView(townLocationMap.get(val), 0);
+        this.$refs.mapLoaderRef.setView(townLocationMap.get(val), 3);
       } else {
         let polygon = townPolygonMap.get(val);
         map2DViewer.map.fitBounds(polygon.getBounds());
@@ -353,7 +353,7 @@ export default {
     specialTownSelect(val) {
       this.$store.commit("changeHomeSpecialTown", val);
       if (val === "全部") {
-        this.$refs.mapLoaderRef.setView(townLocationMap.get(val), 0);
+        this.$refs.mapLoaderRef.setView(townLocationMap.get(val), 3);
       } else {
         let polygon = townPolygonMap.get(val);
         map2DViewer.map.fitBounds(polygon.getBounds());
@@ -473,6 +473,7 @@ export default {
   height: 100%;
   box-sizing: border-box;
   overflow: hidden;
+  background-color: rgb(0, 47, 71);
 }
 /* 镇域专题 */
 #TownContainer {
@@ -715,8 +716,8 @@ export default {
       height: 90%;
       background: rgba(100, 100, 100, 0);
       .bar {
-        width: 100%;
-        height: 98%;
+        width: 340px;
+        height: 276.94px;
       }
     }
   }