update

src/components/chinaMap/chinaHooks.ts

@@ -156,7 +156,7 @@ export function createChartOption({ icons }) {
 /**
  * @description 秒转小时
  * */
-export function convertSeconds(seconds) {
+export function convertSeconds(seconds: number) {
     let hours = Math.floor(seconds / 3600);
     let minutes = Math.floor((seconds % 3600) / 60);
     let remainingSeconds = seconds % 60;
@@ -167,15 +167,9 @@ export function convertSeconds(seconds) {
     };
 }
 
-export function convertMetersToKilometers(meters) {
-    let kilometers = meters / 1000;
-    return Math.round(kilometers * 100) / 100;
-}
-
-export function getTimeStr(time) {
+export function getTimeStr(time: number): string {
     let str = '';
     const { hours, minutes } = convertSeconds(time);
-
     if (hours) {
         str += hours + '小时';
     }
@@ -185,7 +179,12 @@ export function getTimeStr(time) {
     return str;
 }
 
-export function getKmStr(distance) {
+export function convertMetersToKilometers(meters: number): number {
+    let kilometers = meters / 1000;
+    return Math.round(kilometers * 100) / 100;
+}
+
+export function getKmStr(distance: number): string {
     if (!distance) return '';
     let d = convertMetersToKilometers(distance);
     return d >= 1 ? d + '公里' : d * 100 + '米';

src/components/chinaMap/chinaMap.vue

@@ -15,7 +15,7 @@
                         <a-input v-model:value="formState.end"></a-input>
                     </a-form-item>
                     <a-form-item>
-                        <a-button class="reset-btn" @click="clickSearch">清空</a-button>
+                        <a-button class="reset-btn" @click="removeInput">清空</a-button>
                         <a-button class="search-btn" @click="searchRoute">路线规划</a-button>
                     </a-form-item>
                 </a-form>
@@ -82,21 +82,12 @@
             //自定义图片的 路径
             // symbol: 'image://https://img2.baidu.com/it/u=1568770988,2090980470&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=567',  // 图片 URL
             symbol: 'image://' + mapIcons[0], // 图片 URL
-            label: {
-                borderColor: 'red',
-                borderWidth: 2,
-                borderType: 'solid',
-                shadowBlur: '10px',
-                shadowColor: 'red',
-                shadowOffsetX: '5px',
-                shadowOffsetY: '5px',
-            },
         },
     ]);
 
     function changeTab(i) {
-        let x = Math.random() + 5 - Math.random() - i;
-        let y = Math.random() - 5 + Math.random() + i;
+        let x = Math.random() + 5 - Math.floor(Math.random() * 10) - i + Math.random() * 3.5;
+        let y = Math.floor(Math.random() * 10) - 5 + Math.random() + i + Math.random() * 5;
         const o = {
             type: 'scatter',
             zlevel: 100,
@@ -141,7 +132,7 @@
         };
         icons.value = [];
         icons.value.push(o);
-        icons.value.push(line);
+        // icons.value.push(line);
         currentIndex.value = i;
         let myChart = echarts.init(document.querySelector('.china-map-container'));
         initMap(myChart);
@@ -221,7 +212,7 @@
         panelTitle.value = str;
     }
 
-    function searchRoute() {
+    function searchRoute(callback: ((this: MediaQueryList, ev: MediaQueryListEvent) => any) | null) {
         showRoutePanel.value = false;
         panelTitle.value = '';
         if (!formState.value.start) {
@@ -245,9 +236,9 @@
         driving.search([{ keyword: formState.value.start }, { keyword: formState.value.end }], function (status, result) {
             // result 即是对应的驾车导航信息，相关数据结构文档请参考  https://lbs.amap.com/api/javascript-api/reference/route-search#m_DrivingResult
             if (status === 'complete') {
-                console.log('绘制驾车路线完成');
+                //  console.log('绘制驾车路线完成');
             } else {
-                console.log('获取驾车数据失败：' + result);
+                //  console.log('获取驾车数据失败：' + result);
             }
         });
         AMap.Event.addListener(driving, 'complete', (res) => {
@@ -267,7 +258,7 @@
         });
     }
 
-    function clickSearch() {
+    function removeInput() {
         formState.value.start = '';
         formState.value.end = '';
     }