vue3 百度地图 行走路线

要在 Vue3 中实现百度地图行走路线，可以使用百度地图 JavaScript API。具体步骤如下：

1. 在 index.html 中引入百度地图 JavaScript API 的 SDK：

<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥"></script>

其中，ak 是您在百度地图开放平台申请的密钥。

2. 在 Vue3 组件中创建地图容器：

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

3. 在组件的 mounted 钩子函数中初始化地图，并添加行走路线：

mounted() {
  // 初始化地图
  const map = new BMap.Map("map");
  const point = new BMap.Point(116.404, 39.915);
  map.centerAndZoom(point, 15);

  // 添加行走路线
  const walking = new BMap.WalkingRoute(map, {
    renderOptions: { map: map, autoViewport: true }
  });
  const start = new BMap.Point(116.307852, 40.057031);
  const end = new BMap.Point(116.403865, 39.914101);
  walking.search(start, end);
}

其中，BMap 是百度地图 JavaScript API 的命名空间，WalkingRoute 是行走路线的类，renderOptions 中的 map 表示将路线添加到哪个地图上，autoViewport 表示自动调整视野以显示整个路线。