javascript - MapboxGL Javascript API : displaying popup for all markers on map not working on multiple layers

Question

我的 map 上有多个图层，每个图层对应一个特定的符号(一个 Mapbox 图标)并包含带有该符号的所有标记。我希望每个标记都可以通过自己的弹出窗口进行点击。但是，只有添加的最后一层允许用户单击这些标记并看到弹出窗口，而前面的层被覆盖，因此这些层中的标记不可单击。

这是 JS Fiddle(大部分代码来自网站上的两个示例，我正在尝试将它们组合在一起)

https://jsfiddle.net/wy5rdwzz/

我需要这行代码能够通过切换列表来过滤标记，并且我需要每个标记都可以点击。

"filter": ["==", "marker-symbol", symbol]

我将如何使所有标记都可访问(以便可以单击它们并显示弹出窗口)，而不仅仅是最后一层中添加的标记？

此外，如果每个标记都有自己的图层，您将如何在相应标记旁边显示每个标记的名称？

Answer 1

问题是您从未存储图层 ID。每次添加层时，您都会用最新的 ID 覆盖 layerID。因此，当您创建 onclick 和 mousemove 监听器时，您只是将这些监听器添加到最近的层:{ layers: [layerID] }。

我已经编辑了您的 jsfiddle ( here )，以便在每次添加图层时将每个图层 ID 推送到一个数组中:{ layers: layerIdCollection }。

如果您有任何问题，请告诉我:)