体验优化调整

hookehuyr
Commit 624093b7bc0adde7cc365600ffc9ad6d61bfc010 624093b7 1 parent 1f9aa2bb
Showing 2 changed files with 36 additions and 16 deletions
src/common/tiantan_v2.js
src/views/index.vue
--- a/src/common/tiantan_v2.js
View file @624093b
+++ b/src/common/tiantan_v2.js
View file @624093b
@@ -155,7 +155,7 @@ var spotInfo = [
         url: 'https://mp.weixin.qq.com/s/XzSqtH5RPaRSAihQGZJ8hg',
       },
     ],
-    zoom: { 17: 1, 18: 1, 19: 0, 20: 0 },
+    zoom: { 17: 1, 18: 1, 19: 1, 20: 0 },
   },
   {
     name: '钟楼',
--- a/src/views/index.vue
View file @624093b
+++ b/src/views/index.vue
View file @624093b
 <!--
  * @Date: 2023-05-19 14:54:27
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2023-06-07 11:26:02
+ * @LastEditTime: 2023-06-07 15:27:35
  * @FilePath: /map-demo/src/views/index.vue
  * @Description: 地图主体页面
 -->
@@ -186,8 +186,8 @@ export default {
       publicInfo: [], // 公共设施信息实体
       show_popup: false,
       dialog_show: false,
-      xys_lng: '',
+      xys_lng: 120.587334,
-      xys_lat: '',
+      xys_lat: 31.314823,
       walk_route: '',
       toolBar: '',
       isActive: 0,
@@ -275,7 +275,7 @@ export default {
         showIndoorMap: false,
         defaultCursor: 'pointer', // 地图默认鼠标样式
         showBuildingBlock: false, // 是否展示地图 3D 楼块
-        zooms: [17, 19], // 地图显示的缩放级别范围, 默认为 [2, 20] ，取值范围 [2 ~ 30]
+        zooms: [17, 20], // 地图显示的缩放级别范围, 默认为 [2, 20] ，取值范围 [2 ~ 30]
         showLabel: true, // 是否展示地图文字和 POI 信息
         zoom: 18, // 设置地图显示的缩放级别
         pitch: 0, // 俯仰角度，默认 0，最大值根据地图当前 zoom 级别不断增大，2D地图下无效 。
@@ -299,7 +299,7 @@ export default {
       _.each(coord.spotInfo, (x, i) => {
         var marker = new AMap.ElasticMarker({
           position: coord.spotInfo[i].position,
-          zooms: [17, 19],
+          zooms: [17, 20],
           styles: [{
             icon: {
               img: coord.spotInfo[i].icon,
@@ -339,7 +339,7 @@ export default {
       _.each(coord.toiletInfo, (x, i) => {
         var marker = new AMap.ElasticMarker({
           position: coord.toiletInfo[i].position,
-          zooms: [17, 19],
+          zooms: [17, 20],
           styles: [{
             icon: {
               img: coord.toiletInfo[i].icon,
@@ -376,7 +376,7 @@ export default {
       _.each(coord.activityInfo, (x, i) => {
         var marker = new AMap.ElasticMarker({
           position: coord.activityInfo[i].position,
-          zooms: [17, 19],
+          zooms: [17, 20],
           styles: [{
             icon: {
               img: coord.activityInfo[i].icon,
@@ -413,7 +413,7 @@ export default {
       _.each(coord.publicInfo, (x, i) => {
         var marker = new AMap.ElasticMarker({
           position: coord.publicInfo[i].position,
-          zooms: [17, 19],
+          zooms: [17, 20],
           styles: [{
             icon: {
               img: coord.publicInfo[i].icon,
@@ -480,7 +480,7 @@ export default {
         }
       }
     },
-    getLocation() {
+    getLocation() { // 获取经纬度
       AMap.plugin(['AMap.Geolocation'], () => {
         this.geolocation = new AMap.Geolocation(this.location_options);
         this.geolocation.getCurrentPosition((status, result) => {
@@ -491,9 +491,6 @@ export default {
             if (lng && lat) {
               this.current_lng = GPS.gcj_encrypt(lat, lng).lon;
               this.current_lat = GPS.gcj_encrypt(lat, lng).lat;
-              // 西园寺的经纬度
-              this.xys_lng = GPS.gcj_encrypt(31.315021, 120.58848).lon;
-              this.xys_lat = GPS.gcj_encrypt(31.315021, 120.58848).lat;
             }
           }
         })
@@ -582,7 +579,7 @@ export default {
       this.map.remove([this.current_route]);
       this.map.remove(this.safe_route);
     },
-    setTitleLayer() {
+    setTitleLayer() { // 生成瓦片图
       var layer = new AMap.TileLayer.Flexible({
         cacheSize: 50,
         opacity: 1,
@@ -619,7 +616,25 @@ export default {
           };
           img.src = `images/tiles/${z}/${x}_${y}.jpg`
-        }
+        },
+        // createTile: function (x, y, z, success, fail) {
+        //   console.warn(z);
+        //     if ((x + y) % 3) {
+        //         fail();
+        //         return;
+        //     }
+
+        //     var img = document.createElement('img');
+        //     img.onload = function () {
+        //         success(img)
+        //     };
+        //     img.crossOrigin = "anonymous";// 必须添加，同时图片要有跨域头
+        //     img.onerror = function () {
+        //         fail()
+        //     };
+
+        //     img.src = 'https://a.amap.com/jsapi_demos/static/images/amap.png';
+        // }
       });
       this.map.addLayer(layer);
@@ -770,7 +785,12 @@ export default {
         this.navName = 'publicInfo'
         this.setPublicLayer()
       }
-      this.closeInfoWindow()
+      this.closeInfoWindow();
+      setTimeout(() => {
+        // 地图zooms调整
+        this.map.setZoom(18);
+        this.map.setZoomAndCenter(18, [this.xys_lng, this.xys_lat]);
+      }, 100);
     },
     handleSafeRoute(status) { // 打开/关闭逃生路线线
       if (status) {