Просмотр исходного кода

fix: 修复地图跳转问题,确保所有坐标都能在地图上定位

sequoia tungfang недель назад: 3
Родитель
Сommit
99ed3fef54
2 измененных файлов с 37 добавлено и 23 удалено
  1. 25 22
      src/components/TongzhouTrafficMap.vue
  2. 12 1
      src/views/Home.vue

+ 25 - 22
src/components/TongzhouTrafficMap.vue

@@ -100,6 +100,8 @@ export default {
       this.classifyIntersectionsByStatus();
       this.updateMapByMode();
       this.initAMap();
+      // 在数据加载完成后存储坐标
+      this.storeStatusCoordsToLocalStorage();
     });
 
     if (this.$route.path === '/home') {
@@ -290,8 +292,6 @@ export default {
         this.map.on('complete', () => {
           if (!this.isComponentDestroyed) {
             this.drawStaticRoutes();
-            // 临时方案,实际项目中删除 按4:3:3比例提取故障、离线、降级坐标点并存储到localStorage
-            this.storeStatusCoordsToLocalStorage();
           }
         });
       } catch (err) {
@@ -923,6 +923,9 @@ export default {
         setTimeout(() => {
           if (!this.isComponentDestroyed) this.openLightInfo(foundMarker.getExtData(), finalPos);
         }, 600);
+      } else {
+        // 如果找不到对应的标记,直接使用传入的坐标设置地图中心
+        this.map.setZoomAndCenter(17, targetPos, false, 500);
       }
     },
 
@@ -932,32 +935,32 @@ export default {
 
     // 按4:3:3比例提取故障、离线、降级坐标点并存储到localStorage
     storeStatusCoordsToLocalStorage() {
-      // 故障、离线、降级坐标点(按4:3:3比例)
-      const faultCoords = [
-        [116.723317, 39.907606],
-        [116.703624, 39.89801],
-        [116.661252, 39.924948],
-        [116.708958, 39.899609]
-      ];
-      
-      const offlineCoords = [
-        [116.677855, 39.895636],
-        [116.656673, 39.856063],
-        [116.656485, 39.90118]
-      ];
-      
-      const degradedCoords = [
-        [116.713356, 39.952856],
-        [116.665391, 39.934546],
-        [116.697784, 39.891312]
-      ];
+      // 从加载的路口数据中随机选择坐标
+      const availableCoords = this.intersectionData.map(item => [
+        item["位置-经度"],
+        item["位置-纬度"]
+      ]).filter(coord => coord[0] && coord[1]);
+
+      // 按4:3:3比例分配坐标
+      const total = availableCoords.length;
+      const faultCount = 4;
+      const offlineCount = 3;
+      const degradedCount = 3;
+
+      // 随机选择坐标
+      const shuffledCoords = [...availableCoords].sort(() => Math.random() - 0.5);
+      const faultCoords = shuffledCoords.slice(0, faultCount);
+      const offlineCoords = shuffledCoords.slice(faultCount, faultCount + offlineCount);
+      const degradedCoords = shuffledCoords.slice(faultCount + offlineCount, faultCount + offlineCount + degradedCount);
 
       // 组合成10个元素的数组
       const statusCoords = [...faultCoords, ...offlineCoords, ...degradedCoords];
 
       // 存储到localStorage
       statusCoords.forEach((coords, index) => {
-        localStorage.setItem(`pos${index + 1}`, coords.join(','));
+        if (coords && coords.length === 2) {
+          localStorage.setItem(`pos${index + 1}`, coords.join(','));
+        }
       });
 
       console.log('状态坐标已存储到localStorage');

+ 12 - 1
src/views/Home.vue

@@ -211,9 +211,20 @@ export default {
     onAlarmView({ item, index }) {
       console.log('点击了查看:', item);
       // 临时逻辑,有真实接口后可以删除
-      const position = localStorage.getItem(`pos${index + 1}`).split(',');
+      const positionStr = localStorage.getItem(`pos${index + 1}`);
+      let position;
+      
+      if (!positionStr) {
+        console.warn('未找到对应的位置信息,使用默认位置');
+        // 使用默认坐标(通州区中心)
+        position = ['116.663', '39.905'];
+      } else {
+        position = positionStr.split(',');
+      }
 
       // 地图联动
+      console.log(position);
+      
       this.$refs.trafficMapRef.focusByLocation([Number(position[0]), Number(position[1])]);
 
     },