首先要到高德开放平台求接口
重点是认证，个人认证和企业认证，企业认证会得到更多资源。
然后在我的应用，添加Key，加一个“Web端(JS API)”，这个是用amap-vue的前提。
接下来就是vue项目里添加相应的代码。弄一个最简单的显示地图的例子。
1）在main.js里合适的地方，加入：
|
import VueAMap from 'vue-amap'
Vue.use(VueAMap)
VueAMap.initAMapApiLoader ({
key: '申请得到的key',
plugin: ['AMap.Autocomplete', 'AMap.PlaceSearch', 'AMap.Scale', 'AMap.MapType', 'AMap.ToolBar', 'AMap.MapType', 'AMap.Geolocation'],
v: '1.4.4'
})
|
2）在页面里，加入：
|
……
<div v-if="showMap" class="amap-page-container">
<el-amap vid="amap">
<el-amap-marker :position="position"></el-amap-marker>
</el-amap>
</div>
……
|
3）脚本内加入：
|
import { AMapManager } from 'vue-amap'
let amapManager = new AMapManager()
export default {
amapManager,
return {
position: [116.22375, 39.95490],
……
|
4）样式部分：
|
<style lang="scss" scoped>
……
.amap-page-container {
height: 400px;
position: relative;
}
</style>
|
这样就差不多了。
带着使命来到世上的你，给他人提供价值，才有价值