700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > 高德地图使用vue-amap 自定义点坐标

高德地图使用vue-amap 自定义点坐标

时间:2018-10-17 17:37:27

相关推荐

高德地图使用vue-amap  自定义点坐标

1.安装

npm install -S vue-amap

2.自定义点坐标

如果在地图上不显示相应的内容,

注意下面两点

<template><div class="amap-page-container"><el-amapvid="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

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。