微信小程序地图

最新推荐文章于 2023-09-26 17:54:01 发布

裴嘉靖

最新推荐文章于 2023-09-26 17:54:01 发布

阅读量522

点赞数

分类专栏：微信小程序

本文链接：https://blog.csdn.net/peijiajing/article/details/105201674

版权

微信小程序专栏收录该内容

20 篇文章 0 订阅

订阅专栏

地图组件：
完成两大功能：A .显示地理位置；B .标记建筑物。
1、完成最简单的地图显示：
为通过CSS设置一个宽度和高度。
2、如何显示指定位置的地图：
为组件设置下列属性：
longitude，设置显示位置的中心经度。
latitude，设置显示位置的中心纬度。
腾讯微信总部：longitude=113.324520 latitude=23.099994
石家庄世纪公园：longitude=114.539 latitude=38.0161
石家庄火车站西广场：longitude=114.480628 latitude=38.010061
3、组件的常见属性：
scale：设置缩放级别，取值范围3-20，默认值为16。
rotate：设置地图正北方向与设备Y轴之间的夹角，默认值为0。
show-compass：是否显示指南针（false）。
enable-zoom：是否允许缩放（true）。
enable-scroll：是否允许拖拽（true）。
enable-rotate：是否允许旋转（false）。
enable-satellite：是否开启卫星图（false）。
enable-traffic：是否开启实时路况（false）。
4、标记建筑物：
markers属性取值为数组，数组元素是一个个的标记信息。
markers:[
{
longitude:指定标记的精度，
latitude:指定标记的纬度，
iconPath:指定用于标记的图片，
width:指定用于标记的图片的宽度，
height:指定用于标记的图片的高度，
title:指定用户触碰标记时给出的标题，
alpha:指定标记的不透明度，
callout:{ //设置标记上的气泡
content:指定气泡上显示的文本,
display:指定气泡显示的模式（BYCLICK-单击显示，ALWAYS-一直显示）,
padding,color,fontSize,borderColor,bordeWidth,borderRadius,bgColor,textAlign
}
},{},……
]
5、组件的事件：
bindtap，点击地图任意位置时触发。event.detail={longitude,latitude}
bindmarkertap，点击地图上的标记（markers）时触发。
bindcallouttap，点击地图上标记的气泡时触发。
bindupdated，当地图渲染更新完成时触发。

裴嘉靖

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
微信小程序地图

地图组件：完成两大功能：A .显示地理位置；B .标记建筑物。1、完成最简单的地图显示：为通过CSS设置一个宽度和高度。2、如何显示指定位置的地图：为组件设置下列属性：longitude，设置显示位置的中心经度。latitude，设置显示位置的中心纬度。腾讯微信总部：longitude=113.324520 latitude=23.099994石家庄世纪公园：longitud...
复制链接

扫一扫