前提条件,marker有很多个,小程序地图上marker点击后改变尺寸并且将上个点击过的包括其他分类下的marker恢复原来大小,并将地图中心位置以该MARKER为中心
时间: 2024-05-19 15:12:29 浏览: 59
思路:
1. 给每个marker绑定一个点击事件,事件触发时改变该marker的尺寸,并将其他marker恢复原来大小。
2. 记录上一个点击的marker,如果该marker与当前点击的marker不同,则将上一个点击的marker恢复原来大小。
3. 将地图中心位置以点击的marker为中心。
代码示例:
// 初始化地图
const mapCtx = wx.createMapContext('map')
let lastMarker = null // 记录上一个点击的marker
// 给每个marker绑定点击事件
markers.forEach((marker) => {
marker.onTap = () => {
// 改变当前marker的尺寸
marker.width = 30
marker.height = 30
// 将上一个点击的marker恢复原来大小
if (lastMarker && lastMarker.id !== marker.id) {
lastMarker.width = 20
lastMarker.height = 20
}
// 记录当前点击的marker
lastMarker = marker
// 将地图中心位置以点击的marker为中心
mapCtx.moveToLocation({
latitude: marker.latitude,
longitude: marker.longitude,
success: () => {
console.log('地图中心位置已经移动')
}
})
}
})
阅读全文