vue-baidu-map-3x起点终点 缩放到合适位置

以下是使用vue-baidu-map-3x实现起点终点缩放到合适位置的代码：

<template>
  <div>
    <baidu-map
      :center="center"
      :zoom="zoom"
      @ready="onMapReady"
    >
      <bm-marker :position="startPoint" />
      <bm-marker :position="endPoint" />
    </baidu-map>
  </div>
</template>

<script>
import { BaiduMap, Marker } from 'vue-baidu-map-3x'

export default {
  components: {
    BaiduMap,
    BmMarker: Marker
  },
  data() {
    return {
      center: { lng: 116.404, lat: 39.915 },
      zoom: 12,
      startPoint: { lng: 116.404, lat: 39.915 },
      endPoint: { lng: 116.434, lat: 39.908 }
    }
  },
  methods: {
    onMapReady(map) {
      const points = [this.startPoint, this.endPoint]
      const view = map.getViewport(points)
      map.setViewport(view)
    }
  }
}
</script>

在这个例子中，我们使用了vue-baidu-map-3x的BaiduMap和Marker组件来展示地图和标记起点和终点。在onMapReady方法中，我们使用getViewport方法获取包含所有点的最佳视野，并使用setViewport方法将地图缩放到合适的位置。