Листовка о событии mouseout не срабатывает при изменении iconUrl

Question

У меня проблема с листовкой, и это событие mouseout.

В приведенном ниже коде иногда (особенно при быстром перемещении мыши) событие mouseout не запускается. Mouse out ! не отображается в консоли.

Я обнаружил, что такое поведение связано с заменой значка. Простой layer.setStyle работает каждый раз. (Здесь я использую плагин leaflet-gpx , но он работает так же, как leaflet's IconUrl или shadowUrl )

// This works every time
gpxPath.on('mouseover', function (e) {
    var layer = e.target;
    layer.options.marker_options.startIconUrl = 'myHoverIconStartUrl';
    layer.options.marker_options.endIconUrl = 'myHoverIconEndUrl';
    layer.reload();
});

gpxPath.on('mouseout', function (e) {
    console.log('Mouse out !')
    var layer = e.target;
    /* those two lines below cause the issue */
    layer.options.marker_options.startIconUrl = '';
    layer.options.marker_options.endIconUrl = '';
    layer.reload();
});

Я знаю, что событие mouseout иногда вызывает проблемы, подобные этой, но в данном конкретном случае я вынужден использовать события листовки, и у меня немного нет идей.

Answer 1

Вы пытаетесь заставить маркеры отображать другой значок при наведении?

Трудно сказать без примера, но я думаю, что происходит следующее:

Ваше событие mouseout не 'не запускается надежно, потому что событие mouseover запускается непрерывно, пока ваша мышь находится на нем, каждый раз, когда значки перестраиваются.

Вы можете заметить это, если добавите console.log в это функции. Вы можете уйти, пока он перестраивается, поэтому вы не сможете надежно запустить событие mouseout.

Если да, попробуйте что-нибудь вроде:

line.once('mouseover', function () {
    //switch to icons

});

line.on('mouseout', function () {
    //clear icons
    
    //Prevent mouseover event from firing continuously if/when the icon changes
    line.once('mouseover', function () {
        //switch to icons
    });
});