微信map的使用

本文介绍了微信小程序中地图组件(Map)和MapContext API的使用,重点讨论了如何实现轨迹回放功能,包括平移marker、点聚合优化以及注意事项。在地图聚合部分,提到了如何初始化配置、添加和移除marker,以及在地图缩放后的更新策略。对于大量marker的展示,建议使用点聚合来提升用户体验和性能。
摘要由CSDN通过智能技术生成

官方文档:map | 微信开放文档微信开发者平台文档https://developers.weixin.qq.com/miniprogram/dev/component/map.html官方API:MapContext | 微信开放文档微信开发者平台文档https://developers.weixin.qq.com/miniprogram/dev/api/media/map/wx.createMapContext.html

轨迹回放

常用api

平移marker,带动画:MapContext.translateMarker(Object object) | 微信开放文档

 沿指定路径移动 marker,用于轨迹回放等场景。动画完成时触发回调事件,若动画进行中,对同一 marker 再次调用 moveAlong 方法,前一次的动画将被打断

 注意事项

注意一些方法,最好写在compelete回调中,使用success只是证明接口调用成功

地图聚合

当地图上需要展示的标记点 marker 过多时,可能会导致界面上 marker 出现压盖,展示不全,并导致整体性能变差。针对此类问题,推出点聚合能力。

使用流程如下:

  1. MapContext.initMarkerCluster 对聚合点进行初始化配置(可选);
  2. MapContext.addMarkers 指定参与聚合的 marker;
  3. MapContext.on('markerClusterCreate', callback) 触发时,通过 MapContext.addMarkers 更新聚合簇的样式 (可选);
  4. MapContext.removeMarkers 移除参与聚合的 marker;

在地图的放大缩小之后需要更新地图数据时如果接口需要传递屏幕四个角的经纬度需要注意,在地图更新到具体的范围后再去调用接口(加延时)

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值