傳單標記圖標的動畫過渡

Question

我有一個帶有藍色圖標的傳單標記（來自 PNG 圖像源）。 在鼠標懸停時，我想讓它變成紅色圖標。

這是這樣做的代碼：

            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)
            );

現在我想通過動畫逐漸進行這種過渡。

我怎樣才能做到這一點？

Answer 1

編寫您自己的 CSS 過渡。

http://css3.bradshawenterprises.com/cfimg/

---

或者使用插件 Leaflet.TransitionedIcon

https://github.com/naturalatlas/leaflet-transitionedicon