[英]Animated transition of leaflet Marker icon
I have a Leaflet marker with a BLUE icon (from a PNG image source).我有一个带有蓝色图标的传单标记(来自 PNG 图像源)。 On mouse hovering, I want to make that a RED icon.在鼠标悬停时,我想让它变成红色图标。
This is the code for doing so:这是这样做的代码:
let placeMarker = L.marker(...);
let cssSetter = function (imarker, iicon) {
imarker.setIcon(iicon);
};
placeMarker.on('mouseover',
L.bind(cssSetter, null, placeMarker, markerIcon_red)
);
placeMarker.on('mouseout',
L.bind(cssSetter, null, placeMarker, markerIcon)
);
Now I want to do this transition gradually, with an animation.现在我想通过动画逐渐进行这种过渡。
How can I do this?我怎样才能做到这一点?
Write your own CSS transition.编写您自己的 CSS 过渡。
http://css3.bradshawenterprises.com/cfimg/ http://css3.bradshawenterprises.com/cfimg/
Or use plugin Leaflet.TransitionedIcon或者使用插件 Leaflet.TransitionedIcon
https://github.com/naturalatlas/leaflet-transitionedicon https://github.com/naturalatlas/leaflet-transitionedicon
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.