小程序地图上marker点击后改变尺寸并且将上个点击过的marker恢复原来大小
时间: 2024-05-12 22:20:43 浏览: 107
您可以通过以下步骤,在小程序地图上实现marker点击后改变尺寸并且将上个点击过的marker恢复原来大小:
1. 在marker的tap事件中,获取当前点击的marker的id。
2. 遍历所有的marker,找到上一个被点击的marker,并将它的大小恢复原来。
3. 将当前点击的marker的大小改变。
下面是一个示例代码:
```
// 定义一个变量来存储上一个被点击的marker的id
var lastMarkerId = '';
Page({
onMarkerTap: function (e) {
var markerId = e.markerId;
// 遍历所有的marker,找到上一个被点击的marker,并将它的大小恢复原来
if (lastMarkerId !== '') {
this.mapCtx.getMarkerById(lastMarkerId).then((res) => {
res.width = 20;
res.height = 20;
this.mapCtx.updateMarker(res);
});
}
// 将当前点击的marker的大小改变
this.mapCtx.getMarkerById(markerId).then((res) => {
res.width = 30;
res.height = 30;
this.mapCtx.updateMarker(res);
});
// 更新lastMarkerId
lastMarkerId = markerId;
}
})
```
在上面的代码中,我们定义了一个变量`lastMarkerId`来存储上一个被点击的marker的id。在每次点击marker时,我们先遍历所有的marker,找到上一个被点击的marker,并将它的大小恢复原来。然后将当前点击的marker的大小改变。最后更新`lastMarkerId`为当前点击的marker的id。
阅读全文