map

src/views/trhj/trgis/components/wrdkCharts.vue

@@ -7,9 +7,7 @@
           <a-row :gutter="12">
             <a-col :xl="5" :lg="6" :md="7" :sm="24">
               <a-form-item>
-                <a-select placeholder="请选择行政区划" ref="select" v-model="searchFrom.countryCode"
-                :disabled="handleChangeBtnDisabled" 
-                >
+                <a-select placeholder="请选择行政区划" ref="select" v-model="searchFrom.countryCode" :disabled="handleChangeBtnDisabled">
                   <a-select-option value="">郑州市</a-select-option>
                   <a-select-option :value="item.code" v-for="(item, id) in country" :key="id">
                     {{ item.name }}
@@ -120,12 +118,12 @@ export default {
   },
   methods: {
     ...mapGetters(['userInfo']),
-    handleCreateTime(e) {
+    handleCreateTime (e) {
       this.searchFrom.dkStart = e[0]
       this.searchFrom.dkEnd = e[1]
     },
     // 判断是否为非郑州或省级别权限——如若不是，则限制行政区域搜索框
-    searchCurrentcountryCode(){
+    searchCurrentcountryCode () {
       this.handleChangeBtnDisabled = !!this.userInfo().countryCode
       this.countryCode = this.userInfo().countryCode
       this.searchFrom.countryCode = this.userInfo().countryCode
@@ -146,6 +144,25 @@ export default {
         this.country = res.result
       })
     },
+    calculateScaleFromZoom (zoom) {
+      let a = {
+        "5": 1.00000010817046858256990966796875,
+        "6": 0.0000002163409371651398193359375,
+        "7": 0.000000432681874330279638671875,
+        "8": 0.00000086536374866055927734375,
+        "9": 0.0000017307274973211185546875,
+        "10": 0.000003461454994642237109375,
+        "11": 0.00000692290998928447421875,
+        "12": 0.0000138458199785689484375,
+        "13": 0.000027691639957137896875,
+        "14": 0.00005538327991427579375,
+        "15": 0.0001107665598285515875,
+        "16": 0.000221533119657103175,
+        "17": 0.00044306623931420635,
+        "18": 0.0008861324786284127,
+      }
+      return a[zoom]
+    },
     initMap () {
       let that = this
       this.map = L.map('map_wrdkCharts', {
@@ -158,36 +175,51 @@ export default {
       getAction('/zrzyj/getToken').then((res) => {
         this.token = res.result
         this.timestamp = res.timestamp
-        let slUrl = `http://123.160.223.44:82/share/2023nqsdzdtxxcxv1/tileImage.png?width=256&height=256&redirect=false&transparent=true&cacheEnabled=true&origin=%7B%22x%22:-180,%22y%22:90%7D&overlapDisplayed=false&scale=0.00044306623931420635&x={x}&y={y}&access_token=${this.token}`
-        let yxUrl = `http://123.160.223.44:82/share/2023nasdzdtxxcxv2/tileImage.png?width=256&height=256&redirect=false&transparent=true&cacheEnabled=true&origin=%7B%22x%22:-180,%22y%22:90%7D&overlapDisplayed=false&scale=0.00044306623931420635&x=213971&y=40225&access_token=${this.token}`
-        // 生命图层组
 
+        // 2023年浅色电子地图
+        let slUrl = `http://123.160.223.44:82/share/2023nqsdzdtxxcxv1/tileImage.png?width=256&height=256&redirect=false&transparent=true&cacheEnabled=true&origin=%7B%22x%22:-180,%22y%22:90%7D&overlapDisplayed=false&scale={scale}&x={x}&y={y}&access_token=${this.token}`
+        // 2023年暗色电子地图
+        let yxUrl = `http://123.160.223.44:82/share/2023nasdzdtxxcxv2/tileImage.png?width=256&height=256&redirect=false&transparent=true&cacheEnabled=true&origin=%7B%22x%22:-180,%22y%22:90%7D&overlapDisplayed=false&scale={scale}&x={x}&y={y}&access_token=${this.token}`
+
+        // 生命图层组
         let baseLayer_sl = L.layerGroup([
-          L.tileLayer(slUrl, //大数据平台 矢量服务
+          L.tileLayer(slUrl,
             {
-              layer: '2023nqsdzdtxxcxv1',
-              tilematrixSet: 'EPSG:4326',
-              style: 'default',
-              tileSize: 256, //切片大小
-              format: 'image/png',
-              maxZoom: 17,
-              minZoom: 1,
+              scale: function (a) {
+                debugger
+                return that.calculateScaleFromZoom(a.z);
+              }
             }
           ),
         ])
-
         let baseLayer_yx = L.layerGroup([
-          L.tileLayer.wms(yxUrl, //大数据平台 影像服务
+          L.tileLayer(yxUrl,
             {
-              layer: '2023nasdzdtxxcxv2',
-              style: 'default',
-              tilematrixSet: 'EPSG:4326',
-              format: 'image/png',
-              transparent: true,
+              scale: function (a) {
+                debugger
+                return that.calculateScaleFromZoom(a.z);
+              }
             }
           ),
         ])
-        
+
+        // L.tileLayer('http://t0.tianditu.com/img_c/wmts?service=wmts&request=GetTile&version=1.0.0&LAYER=img&tileMatrixSet=c&TileMatrix={z}&TileRow={y}&TileCol={x}&style=default.jpg&tk=3cf92df1e46b9a576fa8d3f427030886',
+        //   {
+        //     zoomOffset: 1
+        //   }
+        // ),
+
+        // let baseLayer_yx = L.layerGroup([
+        //   L.tileLayer.wms(yxUrl, //大数据平台 影像服务
+        //     {
+        //       layer: '2023nasdzdtxxcxv2',
+        //       style: 'default',
+        //       tilematrixSet: 'EPSG:4326',
+        //       format: 'image/png',
+        //       transparent: true,
+        //     }
+        //   ),
+        // ])
 
         this.map.addLayer(baseLayer_sl)
 
@@ -197,7 +229,7 @@ export default {
 
         var baseMaps = {
           矢量: baseLayer_sl,
-         影像: baseLayer_yx,
+          影像: baseLayer_yx,
         }
 
         L.control.layers(baseMaps).addTo(this.map)
@@ -342,13 +374,13 @@ export default {
       this.map.on('zoomend', function (e) {
         let zoom = that.map.getZoom()
         if (zoom > 10) {
-          that.map.removeLayer(that.bjLayer)
-          that.map.addLayer(that.bj_cLayer)
+          // that.map.removeLayer(that.bjLayer)
+          // that.map.addLayer(that.bj_cLayer)
           that.reSetLayerIndex()
         }
         if (zoom <= 10) {
-          that.map.removeLayer(that.bj_cLayer)
-          that.map.addLayer(that.bjLayer)
+          // that.map.removeLayer(that.bj_cLayer)
+          // that.map.addLayer(that.bjLayer)
           that.reSetLayerIndex()
         }
       })