使用百度地图

export const baiduMap = function() {
  return new Promise(function(resolve, reject) {
    window.init = function() {
      resolve(window.BMap);
    };
    var script = document.createElement("script");
    script.type = "text/javascript";
    script.src =
      "http://api.map.baidu.com/api?v=3.0&ak=HvdzVtkOMwvRqzusA83TKxeyZCkCa8mG&callback=init";
    script.onerror = reject;
    document.head.appendChild(script);
  });
};

使用：

// 1.
import { baiduMap } from "../plugins/baiduMap";
// 2.
<div id="MyMap" class="dv_flyline_chart_enhanced"></div>
//3.
baiduMap().then(BMap => {
        let map = new BMap.Map("MyMap"); // 创建Map实例
        map.enableScrollWheelZoom(); //启用滚轮放大缩小
        //初始化缩放
        let position = JSON.parse(localStorage.getItem("position"));
        var point = new BMap.Point(position.longitude, position.latitude); // 创建点坐标
        map.centerAndZoom(point, 15);
        map.setMapStyleV2({
          styleId: "aad2a437c0b0c16f937f4d4115aeafd8"		// 自定义样式
        });
        //获取行政区域范围，缩放地图
        var bdary = new BMap.Boundary();
        bdary.get(position.nameCn, function(rs) {		 //获取行政区域
          var count = rs.boundaries.length; 				 //行政区域的点有多少个
          for (var i = 0; i < count; i++) {
            var ply = new BMap.Polygon(rs.boundaries[i], {
              strokeColor: "#377bac",
              fillColor: "", //为空不填充
              strokeWeight: 2,
              strokeOpacity: 1
            }); //建立多边形覆盖物
            map.addOverlay(ply); //添加覆盖物
            map.setViewport(ply.getPath()); //调整视野
          }
        });
        this.marks.forEach(item => {
          // console.log("item", item);
          let pt = new BMap.Point(item.longitude, item.latitude);
          // edit
          let marker = null;
          marker = new BMap.Marker(pt);
          map.addOverlay(marker); // 将标注添加到地图中
          let opts = {
            width: 300, // 信息窗口宽度
            minHeight: 100, // 信息窗口高度
            title: item.companyName, // 信息窗口标题
            message: ""
          };
          let str = this.getTextTmpGroup(item);
          let infoWindow = new BMap.InfoWindow(str, opts); // 创建信息窗口对象
          marker.addEventListener("click", function() {
            map.openInfoWindow(infoWindow, pt); //开启信息窗口
          });
        });
      });