diff --git a/src/mapbox/mapbox.ts b/src/mapbox/mapbox.ts index 4ed449c4d..d69e4fbd3 100644 --- a/src/mapbox/mapbox.ts +++ b/src/mapbox/mapbox.ts @@ -793,27 +793,32 @@ export default class Mapbox { if (shouldTrackHoveredFeatures) { const eventType = e.type; - const wasHovering = this._hoveredFeatures?.length > 0; + const hoveredFeaturesLen = this._hoveredFeatures?.length || 0; let features; if (eventType === 'mousemove') { try { - features = this._map.queryRenderedFeatures(e.point, { - layers: props.interactiveLayerIds - }); + features = this._map + .queryRenderedFeatures(e.point, { + layers: props.interactiveLayerIds + }) + .filter( + (feature, index, array) => + array.findIndex(f => f.layer.id === feature.layer.id) === index + ); } catch { features = []; } } else { features = []; } - const isHovering = features.length > 0; + const hoveringFeatureLen = features.length; - if (!isHovering && wasHovering) { + if (hoveringFeatureLen < hoveredFeaturesLen) { e.type = 'mouseleave'; this._onPointerEvent(e); } this._hoveredFeatures = features; - if (isHovering && !wasHovering) { + if (hoveringFeatureLen > hoveredFeaturesLen) { e.type = 'mouseenter'; this._onPointerEvent(e); }