修改地图放大缩小异常

src/views/leaflet.vue

@@ -743,6 +743,8 @@ export default {
     initMap() {
       let that = this;
       that.drawOpacity();
+      // 地图服务缓存范围（ArcGIS MapServer fullExtent 转近似经纬度）
+      // xmin=11966205→lng≈107.5, ymin=2760925→lat≈24.8, xmax=14751459→lng≈132.5, ymax=4536685→lat≈37.6
       map2DViewer.map = L.map("map2DViewer", {
         minZoom: 10,
         maxZoom: 19,
@@ -750,6 +752,9 @@ export default {
         zoomControl: false,
         renderer: L.canvas(),
         doubleClickZoom: false,
+        // 限制地图可视范围，避免用户拖到瓦片服务无数据区域返回404
+        maxBounds: L.latLngBounds([22, 106], [40, 134]),
+        maxBoundsViscosity: 1.0,
       }).setView([31.182190465827375, 121.25394898932429], 14);
 
       // this.layer = this.addTiledMapLayer(
@@ -938,17 +943,35 @@ export default {
         this.renderLifeDatasInCircle(e.latlng);
     },
 
-    // 添加tiledMapLayer图层 -- 针对arcgis rest services
+    // 添加ArcGIS瓦片服务图层 -- 使用原生L.TileLayer避免esri-leaflet异步元数据加载和ORB拦截问题
+    // 注意：该ArcGIS MapServer瓦片实际返回512x512像素，但瓦片坐标按256x256标准墨卡托方案计算
+    // 因此tileSize保持256（用于坐标映射），通过CSS强制图片显示为256x256（获得高DPI清晰度）
     addTiledMapLayer(url) {
-      let layer = L.esri.tiledMapLayer({
+      // 确保URL以/结尾，避免出现 MapServertile 这种拼接
+      let serviceUrl = url.replace(/\/?$/, '/');
+      let tileTemplate = serviceUrl + 'tile/{z}/{y}/{x}';
+
+      let CustomArcGisTile = L.TileLayer.extend({
+        createTile: function (coords, done) {
+          let tile = L.TileLayer.prototype.createTile.call(this, coords, done);
+          if (tile) {
+            tile.style.width = '256px';
+            tile.style.height = '256px';
+            tile.crossOrigin = 'anonymous';
+          }
+          return tile;
+        },
+      });
+
+      return new CustomArcGisTile(tileTemplate, {
         tileSize: 256,
-        url: url,
         minZoom: 10,
-        minNativeZoom: 10,
-        maxNativeZoom: 19,
         maxZoom: 19,
+        errorTileUrl:
+          'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mNk+P+/HgAFhAJ/wlseKgAAAABJRU5ErkJggg==',
+        continuousWorld: false,
+        noWrap: true,
       });
-      return layer;
     },
     addPolygon(feature, color, configKey, groupsName, fillOpacity,itemName) {
 
@@ -1876,7 +1899,7 @@ export default {
       ) {
         return window.map2DViewer.map;
       }
-      console.error("地图实例未找到或未初始化");
+      // console.error("地图实例未找到或未初始化");
       return null;
     },
     // 清除测距数据 - 优化版