如何忽略地图框图层上的鼠标事件
How to ignore mouse events on a mapbox layer
我在我的 Mapbox 地图上建立了一个标记，当用户将鼠标悬停在它上面时看起来像这样：
我 运行 遇到的问题是文档图标与背景图钉是一个单独的层。这样用户就可以上传自定义图标。使用 mouseover 和 mouseleave 事件在背景 pin 层上创建悬停弹出窗口时，当用户将鼠标悬停在图标层上时，弹出窗口会闪烁。这是因为用户在技术上离开了背景pin层。
我知道有 javascript 可能会造成混乱的黑客攻击，但我真正想要的是一种在 mapbox 图层上处理 "ignore" 事件的方法。这可能吗？
编辑：此处的标记呈现为 Mapbox 层，而不是 HTML 标记，因此使用 canvas 绘制（我相信），因此使用 CSS 忽略事件是不可能的。
使用 CSS 忽略鼠标事件的一种简单方法是使用样式 属性 pointer-events:none 这不会触发元素上的任何指针（鼠标）事件
您可以在不指定图层的情况下注册 mousemove 事件，并使用 queryRenderedFeatures 查看光标是否在您的两个图层中的任何一个上，而不是按图层注册事件。
另一种方法是使用 https://www.mapbox.com/mapbox-gl-js/example/add-image/ 之类的技术并创建合成图像客户端，这样您就只有一层。
我在我的 Mapbox 地图上建立了一个标记，当用户将鼠标悬停在它上面时看起来像这样：
我 运行 遇到的问题是文档图标与背景图钉是一个单独的层。这样用户就可以上传自定义图标。使用 mouseover 和 mouseleave 事件在背景 pin 层上创建悬停弹出窗口时，当用户将鼠标悬停在图标层上时，弹出窗口会闪烁。这是因为用户在技术上离开了背景pin层。
我知道有 javascript 可能会造成混乱的黑客攻击，但我真正想要的是一种在 mapbox 图层上处理 "ignore" 事件的方法。这可能吗？
编辑：此处的标记呈现为 Mapbox 层，而不是 HTML 标记，因此使用 canvas 绘制（我相信），因此使用 CSS 忽略事件是不可能的。
使用 CSS 忽略鼠标事件的一种简单方法是使用样式 属性 pointer-events:none 这不会触发元素上的任何指针（鼠标）事件
您可以在不指定图层的情况下注册 mousemove 事件，并使用 queryRenderedFeatures 查看光标是否在您的两个图层中的任何一个上，而不是按图层注册事件。
另一种方法是使用 https://www.mapbox.com/mapbox-gl-js/example/add-image/ 之类的技术并创建合成图像客户端，这样您就只有一层。