小程序地图上marker点击后改变尺寸并且将上个点击过的marker恢复原来大小,并将地图中心位置以该MARKER为中心
时间: 2024-04-29 07:23:47 浏览: 10
可以使用以下代码实现:
```
// 在marker点击事件中获取该marker对象
var marker = e.marker;
// 获取上一个被点击的marker对象
var lastMarker = this.data.lastMarker;
// 如果上一个被点击的marker存在,则将其恢复原来的尺寸
if (lastMarker) {
lastMarker.setIcon({
width: 20,
height: 30
});
}
// 将当前点击的marker的尺寸改变
marker.setIcon({
width: 30,
height: 40
});
// 将地图中心位置以该marker为中心
var map = wx.createMapContext("map");
map.moveToLocation({
latitude: marker.latitude,
longitude: marker.longitude
});
// 将当前点击的marker对象保存为上一个被点击的marker
this.setData({
lastMarker: marker
});
```
其中,`e`是marker的点击事件对象,通过`e.marker`可以获取到点击的marker对象。通过`setIcon`方法可以改变marker的尺寸,`moveToLocation`方法可以将地图中心位置以该marker为中心。最后,将当前点击的marker对象保存为上一个被点击的marker,以备下一次点击时恢复其原来的尺寸。
相关推荐
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)