效果图:
这是高德地图API文档地址:地图的创建-生命周期-示例中心-JS API 示例 | 高德地图API
1.安装
vue-amap安装
1
npm i --save vue-amap@0.5.10
2.main.js中的配置
key申请地址教程:准备-入门-教程-地图 JS API | 高德地图API
// 高德离线地图
import VueAMap from 'vue-amap';
Vue.use(VueAMap);
VueAMap.initAMapApiLoader({
// 高德key
key: 'd6eabbd08f89ccfb74278b36ab6342567', // 自己到官网申请,我随便写的
// 插件集合 (插件按需引入)
plugin: ['AMap.Autocomplete', 'AMap.PlaceSearch', 'AMap.Scale', 'AMa