(参考官方文档:高德地图)
1.引入
在index.html中引入
<script src="https://webapi.amap.com/maps?v=1.4.1&key=0d78256ea89beeb8c25d1cd047549d1f"></script>
<script src="https://webapi.amap.com/ui/1.0/main.js?v=1.0.11"></script>
2.页面中添加高德地图
// html
<div id="map-area"></div>
// js 在mounted里面进行
data() {
return {
mapMarker: [ // 点标记数组
{
address:'上海市徐汇区小木桥路470号',
id: "d4378a71945248fe8ab4e1f3af20628e",
latitudeGD: 31.19331,
level: "市级",
longitudeGD: 121.460609,
name: "上海市公共法律服务中心",
url: "http://sh.12348.gov.cn/sites/12348/zxspace/org-detail.jsp?entityId=d4378a71945248fe8ab4e1f3af20628e"
},
{
address: "南丹东路60号",
id: "d4378a718fc14dd996b83bb7f1ea1d46",
latitudeGD: 31.190249,
level: "区级",
longitudeGD: 121.444415,
name: "徐汇区公共法律服务中心",
url: "http://sh.12348.gov.cn/sites/12348/zxspace/org-detail.jsp?entityId=d4378a718fc14dd996b83bb7f1ea1d46"
}
],
}
}