vue项目使用vue-amap调用高德地图api详细步骤

想要的效果如下 ：

高德地图 && 信息窗体

 

步骤一：

• 申请高德key

  高德开放平台 | 高德地图API (amap.com)

(可参考博客：   [996]如何申请高德地图用户Key_周小董的博客-CSDN博客_高德开发者平台申请key)

步骤二：

• npm安装

          npm install vue-amap --save

步骤三：

• main.js中挂载vue-amap

// 引入高德地图
import VueAMap from "vue-amap";

Vue.use(VueAMap);

// 初始化vue-amap
VueAMap.initAMapApiLoader({
  // 高德的key
  key: "8bc