Leaflet Mouseout调用MouseOver事件 [英] Leaflet Mouseout called on MouseOver event

问题描述

我有一张活页动态添加标记的传单。

I have a leaflet map where I'm dynamically adding markers.

当我将鼠标悬停在标记上时，点击标记。

I want to call the popup for a marker when I hover over it in addition to when I click the marker.

我的代码是：

function makeMarker(){
   var Marker = L.marker...
   Marker.on('mouseover', function(){Marker.bindPopup('HI').openPopup();});

   Marker.on('mouseout', function(){Marker.closePopup();});
}

如果我注释掉mouseout行，然后弹出窗口，点击elswhere关闭它。
问题是当我放在mouseout，当时，光标悬停在标记上，没有显示。我认为弹出窗口是打开的，但随后关闭真快，这就是为什么光标闪烁，但我不知道如何解决这个

If I comment out the mouseout line, then the popup appears but then I have to click elswhere to close it. The problem is when I put in the mouseout, at that point, the cursor kinda flickers when it hovers over the marker and nothing shows. I think that the popup is openning but then closing really fast which is why the cursor flickers but I don't know how to fix this

推荐答案

弹出窗口实际上是在游标下面加载，并从标记中窃取鼠标，触发Marker.mouseout（）事件，这会导致弹出窗口关闭并重新触发Marker.mouseover（）事件...

The popup is actually loading underneath the cursor and 'stealing' the mouse from the Marker, triggering the Marker.mouseout() event, which causes the popup to close and re-triggers the Marker.mouseover() event... and the cycle continues which is why you see the 'flicker'.

我已经看到这种情况发生取决于缩放级别（通常是放大时）。

I have seen this happen depending on the zoom level (usually when zoomed right out).

尝试在弹出式视窗选项中加入偏移量，即可将其移除：

Try adding an offset into your popup options to get it out of the way:

function makeMarker(){
   var Marker = L.marker...
   Marker.on('mouseover', function(){Marker.bindPopup('HI', {'offset': L.point(0,-50)}).openPopup();});

   Marker.on('mouseout', function(){Marker.closePopup();});
}

这篇关于Leaflet Mouseout调用MouseOver事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！