vue高德地图路线规划

可以使用高德地图JavaScript API来实现Vue高德地图路线规划。具体的步骤包括：引入高德地图JavaScript API，创建地图实例，添加插件，创建起点和终点，调用路线规划API，解析返回结果并展示在地图上。以下是一个简单的例子：

<template>
  <div id="map"></div>
</template>

<script>
import { MapLoader, Map } from 'vue-amap';

export default {
  components: {
    MapLoader,
  },
  data() {
    return {
      mapInstance: null,
      startPoint: [116.397428, 39.90923],
      endPoint: [116.418261, 39.921984],
    };
  },
  mounted() {
    MapLoader.load({
      key: 'your amap key',
      version: '1.4.15',
      plugins: ['AMap.Driving'],
    }).then((AMap) => {
      this.mapInstance = new AMap.Map('map', {
        zoom: 10,
        center: this.startPoint,
      });

      const startMarker = new AMap.Marker({
        position: this.startPoint,
        map: this.mapInstance,
      });

      const endMarker = new AMap.Marker({
        position: this.endPoint,
        map: this.mapInstance,
      });

      const driving = new AMap.Driving({
        map: this.mapInstance,
        policy: AMap.DrivingPolicy.LEAST_TIME,
      });

      driving.search(this.startPoint, this.endPoint, (status, result) => {
        if (status === 'complete') {
          const path = [];
          const steps = result.routes[0].steps;
          steps.forEach((step) => {
            const { path: stepPath } = step;
            path.push(...stepPath);
          });

          const polyline = new AMap.Polyline({
            path,
            strokeColor: '#3366FF',
            strokeWeight: 5,
          });

          polyline.setMap(this.mapInstance);
        }
      });
    });
  },
};
</script>

<style scoped>
#map {
  height: 400px;
}
</style>