1.安装
npm install -S vue-amap2.自定义点坐标
如果在地图上不显示相应的内容,
注意下面两点
<template>
<div class="amap-page-container">
<el-amap
vid="amapDemo"
:center="center"
:zoom="zoom"
class="amap-demo">
<!-- 一定要添加:content="marker.content"********* -->
<el-amap-marker v-for="(marker, index) in markers" :position="marker.position" :vid="index" :content="marker.content"></el-amap-marker>
</el-amap>
</div>
</template>
<script>
module.exports = {
data: function() {
let self = this;
const center = [121.59996, 31.197646];
return {
zoom: 12,
center,
markers: []
};
},
created() {
let self = this;
let markers = [];
let index = 0;
let basePosition = [121.59996, 31.197646];
let num = 10;
// content添加相应的内容**********
for (let i = 0 ; i < num ; i++) {
markers.push({
position: [basePosition[0], basePosition[1] + i * 0.03],
content: `content ${i}`
});
}
this.markers = markers;
}
};
</script>官方文档:https://elemefe.github.io/vue-amap/#/zh-cn/introduction/install
版权声明:本文为memoryI原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。