vue 高德地图 点标记 鼠标悬浮 跳动一下
时间: 2023-07-13 21:06:40 浏览: 253
可以通过给点标记添加自定义动画效果来实现鼠标悬浮时跳动一下的效果。具体实现方法如下:
1. 在创建点标记时,设置点标记的自定义动画效果,例如:
```
let marker = new AMap.Marker({
position: [lng, lat],
animation: 'AMAP_ANIMATION_BOUNCE' // 设置动画效果为弹跳
});
```
2. 监听点标记的 mouseover 和 mouseout 事件,分别触发动画效果和停止动画效果,例如:
```
// 鼠标悬浮时触发动画效果
marker.on('mouseover', function() {
marker.setAnimation('AMAP_ANIMATION_BOUNCE');
});
// 鼠标移开时停止动画效果
marker.on('mouseout', function() {
marker.setAnimation(null);
});
```
这样就可以实现鼠标悬浮时点标记跳动一下的效果了。注意,`AMAP_ANIMATION_BOUNCE` 是高德地图 API 中提供的一种动画效果,还可以根据需求选择其他的动画效果。
阅读全文