综合分析切换底图增加其他栏；底图容器缩放调整；标记疑点按钮位置调整；图例跟随侧边栏移动

public/static/config/config.js

@@ -42,6 +42,9 @@ var systemConfig = {
     // url:"http://aimap.pudong.sh:5236/zjmap/reproduction-service/maps/rest/services/sat-2018s2/proxy?AccessKey=lUaEMxqqhZKLSImGuP/Ergx47orYVyIqHVgxfyGpIurKAy9kdq5uU1cWuTuIXeOM"
     // 调用了测绘院底图
     url: "http://10.242.181.28:8080/OneMapServer/rest/services/shmap_anhei/MapServer?token=HL2a2mO-uVdVvkeeX25BUL5cFIc2Q_FFlowrNYTWcBWOlJNoZWhUUOSQN0e6LG6S",
+    // 浦东铁路测试
+    // url:"http://aimap.pudong.sh:5236/zjmap/layer-service/maps/rest/services/layer/pdtl/proxy?AccessKey=lUaEMxqqhZKLSImGuP%2FErgx47orYVyIqHVgxfyGpIurKAy9kdq5uU1cWuTuIXeOM",
+    // url:"http://aimap.pudong.sh:5236/zjmap/layer-service/maps/rest/services/layer/pdtl/proxy?f=json&AccessKey=lUaEMxqqhZKLSImGuP%2FErgx47orYVyIqHVgxfyGpIurKAy9kdq5uU1cWuTuIXeOM&dpi=96&transparent=true&format=png8",
 
     // url:"http://aimap.pudong.sh:5236/maps/rest/services/darkmap-f/proxy",
     // minZoom: 1,
@@ -51,6 +54,9 @@ 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/layer-service/maps/rest/services/layer/pdtl/proxy?f=json&AccessKey=lUaEMxqqhZKLSImGuP%2FErgx47orYVyIqHVgxfyGpIurKAy9kdq5uU1cWuTuIXeOM&dpi=96&transparent=true&format=png8",
+    // url:"http://aimap.pudong.sh:5236/zjmap/layer-service/maps/rest/services/layer/pdtl/proxy?AccessKey=lUaEMxqqhZKLSImGuP%2FErgx47orYVyIqHVgxfyGpIurKAy9kdq5uU1cWuTuIXeOM",
     // 行政区域 -- 村居
     // url: "http://aimap.pudong.sh:5236/zjmap/reproduction-service/maps/rest/services/admin-pudong-sh2k-neighborhood/mapserver?AccessKey=lUaEMxqqhZKLSImGuP/Ergx47orYVyIqHVgxfyGpIurKAy9kdq5uU1cWuTuIXeOM",
 

src/assets/global.css

@@ -276,6 +276,12 @@ th {
 .leaflet-popup-tip {
   background: #002f56;
 }
+
+/* 更改marker的字体样式 */
+.marker-text-style{
+  font-size: 20px;
+}
+
 /* .el-step__icon */
 .el-step__icon {
   background-color: #002f56;

src/components/map/MapHolder.vue

@@ -200,6 +200,22 @@ export default {
       });
       return layer;
     },
+    addDynamicLayer(url) {
+      let layer = L.esri.dynamicMapLayer({
+        url: url,
+        // opacity: 0.8,
+        f: "json",
+        format: 'png8',
+        transparent: true,
+        // tileSize: 512,
+        // url: url,
+        // minZoom: 0,
+        // minNativeZoom: 0,
+        // maxNativeZoom: 7,
+        // maxZoom: 14,
+      });
+      return layer;
+    },
     // 开始标记疑点事件
     startLabelCase() {
       map2DViewer.setDrawTool({ action: "start" });
@@ -661,7 +677,8 @@ export default {
       // 遥感影像图层crs -- original
       let crs = new L.Proj.CRS(
         "EPSG:0986",
-        "+proj=tmerc +lat_0=0 +lon_0=121.2751921 +k=1 +x_0=0 +y_0=-3457147.81 +ellps=krass +units=m +no_defs",
+        "+proj=tmerc +lat_0=0 +lon_0=121.2751921 +k=1 +x_0=0 +y_0=-3457147.81 +ellps=krass +units=m +no_defs"
+        ,
         {
           resolutions: systemConfig.imageryLayer.resolutions,
           origin: [-66000, 75000],
@@ -684,10 +701,17 @@ export default {
       let layer = this.addTiledMapLayer(systemConfig.blueBlackMap.url).addTo(
         map2DViewer.map
       );
+      // let layer = this.addDynamicLayer(systemConfig.blueBlackMap.url).addTo(
+      //   map2DViewer.map
+      // );
       map2DViewer.layers["darkmap"] = layer;
+      // debugger
 
       let imageryLayer = this.addTiledMapLayer(systemConfig.imageryLayer.url);
       map2DViewer.layers["imagery"] = imageryLayer;
+      // let imageryLayer = this.addDynamicLayer(systemConfig.imageryLayer.url);
+      // map2DViewer.layers["imagery"] = imageryLayer;
+
       // map2DViewer.map.on("click", onMapClick);
     },
     onMapClick() {
@@ -853,10 +877,12 @@ export default {
           fillOpacity: 0,
           color: "#e6d273",
         });
+
         wmarker.bindLabel(feature.properties.NAME, {
           noHide: true,
           clickable: true,
-          offset: [-25, 10],
+          offset: [-25, 20],
+          className: "marker-text-style",
         });
         wmarker.addTo(map2DViewer.groups["浦东新区_label"]);
         let circle1 = L.circleMarker(center, {

src/views/ComprehensiveAnalysis.vue

@@ -49,6 +49,27 @@
           </div>
         </div>
       </div>
+      <div
+        class="basemapBox"
+        :style="{
+          backgroundImage: 'url(' + baseMapCollectionArr[2].imgUrl + ')'
+        }"
+        @mouseenter="showMapList(baseMapCollectionArr[2].type)"
+      >
+        <div class="basemapBox-titlebox">
+          {{ baseMapCollectionArr[2].type }}
+        </div>
+        <div class="basemapBox-panel" v-show="otherChecked" @mouseleave="closePanelEvent">
+          <div
+            class="panel-item"
+            v-for="item in mapList[baseMapCollectionArr[2].type]"
+            :key="item.mapName"
+            @click="changeBaseMap(item)"
+          >
+            {{ item.abbr }}
+          </div>
+        </div>
+      </div>
     </div>
     <LawPopup class="comprehensive-analysis-law-popup" />
     <LabelCasePopup
@@ -434,10 +455,12 @@ export default {
       caseAuditEventStatus: false,
       satImgChecked: false,
       airImgChecked: false,
+      otherChecked:false,
       basemapChecked: "",
       mapList: {
         卫星影像: [],
-        航空影像: []
+        航空影像: [],
+        其他:[]
       },
       baseMapCollectionArr: [
         {
@@ -449,6 +472,11 @@ export default {
           id: 2,
           type: "航空影像",
           imgUrl: require("../assets/map/air_img.png")
+        },
+        {
+          id: 3,
+          type: "其他",
+          imgUrl: require("../assets/map/others.png")
         }
       ],
       showJLInfo: false,
@@ -1117,6 +1145,7 @@ export default {
     closePanelEvent() {
       this.satImgChecked = false;
       this.airImgChecked = false;
+      this.otherChecked = false
     },
     changeBase(val) {
       this.basemap = val;
@@ -1125,6 +1154,7 @@ export default {
       }
     },
     changeBaseMap(data) {
+      console.log(data);
       if (this.basemap == 2 && map2DViewer.map.hasLayer(map2DViewer.jlMap)) {
         map2DViewer.map.removeLayer(map2DViewer.jlMap);
         map2DViewer.jlMap = this.$store.state.mapMethodsCollection.get("RENDER").addTiledMapLayer(data.mapUrl);
@@ -1140,6 +1170,7 @@ export default {
       this.$bus.$emit("reJLControl");
       this.satImgChecked = false;
       this.airImgChecked = false;
+      this.otherChecked = false
     },
     // 勾选镇时默认展开当前镇
     changeTownEvent(val) {
@@ -1202,6 +1233,7 @@ export default {
           return v.basemapType === "1";
         });
         this.satImgChecked = true;
+        this.otherChecked = false;
         this.airImgChecked = false;
       }
 
@@ -1210,7 +1242,17 @@ export default {
           return v.basemapType === "2";
         });
         this.satImgChecked = false;
+        this.otherChecked = false;
         this.airImgChecked = true;
+        
+      }
+      if (val === "其他" && map2DViewer.baseMapCollection.length > 0) {
+        this.mapList["其他"] = map2DViewer.baseMapCollection.filter(v => {
+          return v.basemapType === "3";
+        });
+        this.satImgChecked = false;
+        this.airImgChecked = false
+        this.otherChecked = true;
       }
     },
     // 清除页面所有数据
@@ -1834,6 +1876,7 @@ export default {
         }
         this.$Post(this.urlsCollection.selectByUser, paramData).then(res => {
           if (res.code === 200 && res.content.length >= 1) {
+            console.log(res.content);
             this.$store.state.myLabelPointsArr = [];
             this.$store.state.myLabelPointsArr = res.content.map(v => {
               let data = JSON.parse(v.geojson);
@@ -2819,7 +2862,7 @@ export default {
   }
 
   &-basemapswitch {
-    width: 300px;
+    width: 310px;
     height: 80px;
     // border: 1px solid black;
     position: absolute;
@@ -2832,8 +2875,8 @@ export default {
     .basemapBox {
       cursor: pointer;
       border-radius: 5px;
-      width: 120px;
-      height: 75px;
+      width: 90px;
+      height: 70px;
       border: 1px solid rgba(255, 255, 255, 0.6);
       background-repeat: no-repeat;
       background-size: 99% 98%;
@@ -2852,7 +2895,7 @@ export default {
         font-size: 14px;
       }
       &-panel {
-        width: 100px;
+        width: 90px;
         height: 150px;
         border: 1px solid rgba(255, 255, 255, 0.6);
         position: absolute;