1、通过NPM安装vue-amap模块:
npm install --save vue-amap
2、在main.js中引用vue-amap
:
import VueAMap from 'vue-amap';
Vue.use(VueAMap);
// 初始化vue-amap
VueAMap.initAMapApiLoader({
key: '申请的高德地图Key'
});
3、在vue组件中使用:
<template>
<div>
<el-amap
:center='center'
:zoom='zoom'
>
<el-amap-marker
:position="center"
:label="label"
></el-amap-marker>
</el-amap>
</div>
</template>
<script>
data() {
return {
center: [116.397428, 39.90923],
zoom: 15,
label:{
content: '自定义标题',
offset:[10,12]
}
}
}
</script>
网友评论