一、官方文档
微信小程序map官方文档：https://developers.weixin.qq.com/miniprogram/dev/component/map.html
二、显示效果图
三、源码
scale:缩放级别缩放级别，取值范围为3-20，数字越小，地图比例越大(单位面积内显示区域越大)
longitude：经度
latitude：维度
markers:标记点
circles:圆
color:描边颜色
radius：圆的半径，单位m
fillColor:填充颜色
strokeWidth：描边的宽度
iconPath：显示图标
<template> <view style="width: 100%;height: 100%;"> <map style="width: 100%;height: 100vh;" scale=11 longitude="116.513" latitude="39.9313" :markers="markers" :circles="circles"> </map> </view> </template> <script> export default { data() { return { circles: [{ latitude: 39.9313, longitude: 116.513, color: '#FF0000DD', fillColor: '#7cb5ec88', radius: 5000, strokeWidth: 1 }], markers: [{ iconPath: "/static/mark.png", id: 0, longitude: 116.513, latitude: 39.9313, width: 30, height: 30 }] } }, } </script> <style> </style>
四、原生小程序地图参考文章
小程序地图多个 circles 使用demo：https://blog.csdn.net/qq_35713752/article/details/103693671
