vue中使用百度地图

1、申请百度地图开发者秘钥

2、在index.html中引入

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

3、在webpack.base.conf.js中添加配置

 entry: {
    app: './src/main.js'
  },
  externals: {
    BMap: "BMap"
  },

4、引入

import BMap from "BMap";

5、使用

 var map = new BMap.Map("map");
      map.centerAndZoom(
        new BMap.Point(this.formData.long, this.formData.lati),
        12
      );
      var time, distance;
      var searchComplete = function (results) {
        if (transit.getStatus() != BMAP_STATUS_SUCCESS) {
          return;
        }
        var plan = results.getPlan(0);
        time = plan.getDuration(true); //获取时间
        distance = plan.getDistance(true); //获取距离
        starts.time = time;
        starts.distance = distance;
      };
      var transit = new BMap.DrivingRoute(map, {
        renderOptions: { map: map },
        onSearchComplete: searchComplete,
      });
      var start = new BMap.Point(starts.lng, starts.lat);
      var end = new BMap.Point(this.formData.long, this.formData.lati);
      transit.search(start, end);