向多个图层组添加标记

我使用 StyledLayerControl 和 markcluster 使用 leafletjs 创建了一张地图：https://www.wiva.at/v2/basemap-kartentest/每个标记代表一个适合一个类别（=图层组）的研究项目。 不幸的是，我有一些项目分为三类（例如靠近格拉茨的莱布尼茨市最南端的项目）。到目前为止，这个项目由三个标记表示，我得到的反馈令人困惑，尤其是在蜘蛛网视图中。 我遇到了一个问题，当将标记分配给变量，然后将变量添加到多个图层组时，取消选择一个图层组会使标记也会在其他图层组中消失。 那么是否有机会将这样的项目表示为一个标记但出现在多个图层组中？

如果上面的链接不够，我可以添加我的代码（但我担心它有点混乱）。

感谢您的任何提示。

EDIT:

到目前为止，我简单地添加了我的标记：

    //Green Industry projects
    //new (running) projects
    var industry_new = new L.LayerGroup();

    //Renewable Gasfield, laufend, Wiva, ONLINE
    L.marker([46.753278, 15.586361], {icon: industryIcon} ).addTo(industry_new).bindPopup("<p><span style='font-size:12pt;font-weight:bold; color:#0099b8;'>Renewable Gasfield</span></p><b>Projektleitung:</b> Energie Steiermark<br /><b>Standort:</b> Gabersdorf<br /><b>Kategorie:</b> Grüne Industrie<br /><b>Status:</b> laufend<br /><p>Ganzheitlicher Power-to-Gas Ansatz, bei dem aus erneuerbarem Strom durch Elektrolyse grüner Wasserstoff erzeugt wird und eine zweistufige katalytische Methanisierung im großen Maßstab für eine nachhaltige Energieversorgung in den Bereichen Energie, Mobilität und Industrie vereint.</p><a href='https://www.wiva.at/v2/portfolio-item/renewable-gasfield/'>Details...</a>");

    //HyTechbasis 4 WIVA, laufend, Wiva, ONLINE
    L.marker([48.155278, 14.048056], {icon: industryIcon} ).addTo(industry_new).bindPopup("<p><span style='font-size:12pt;font-weight:bold; color:#0099b8;'>HyTechbasis 4 WIVA</span></p><b>Projektleitung:</b> FRONIUS INTERNATIONAL GmbH<br /><b>Standort:</b> Thalheim<br /><b>Kategorie:</b> Grüne Industrie<br /><b>Status:</b> laufend<br /><p>Hydrogen Technology Basis for WIVA</p><a href='https://www.wiva.at/v2/portfolio-item/hytechbasis-4-wiva-hydrogen-technology-basis-for-wiva/'>Details...</a>");

    //Co2EXIDE WIVA, laufend, Wiva, ONLINE
    L.marker([48.33826938809515, 14.317320611066839], {icon: industryIcon} ).addTo(industry_new).bindPopup("<p><span style='font-size:12pt;font-weight:bold; color:#0099b8;'>CO2EXIDE</span></p><b>Projektleitung:</b> (österreichischer Partner) Energieinstitut an der JKU Linz<br /><b>Standort:</b> AGH Krakau Demo-Anlage<br /><b>Kategorie:</b> Grüne Industrie<br /><b>Status:</b> laufend<br /><p>CO2-basierte Elektrosynthese von Ethylen Oxiden</p><a href='http://www.co2exide.eu/'>Details...</a>");
        
    //CORALIS WIVA, laufend, Wiva, ONLINE
    L.marker([48.288029, 14.324497], {icon: industryIcon} ).addTo(industry_new).bindPopup("<p><span style='font-size:12pt;font-weight:bold; color:#0099b8;'>CORALIS</span></p><b>Projektleitung:</b> Fundación CIRCE / Öst. Partner: Energieinstitut an der JKU Linz<br /><b>Standort:</b> Linz<br /><b>Kategorie:</b> Grüne Industrie<br /><b>Status:</b> laufend<br /><p>Erfahrungen im Bereich der Industriesymbiose zusammenstellen</p><a href='https://cordis.europa.eu/project/id/958337'>Details...</a>");

    //UpHY, laufend, Wiva, ONLINE
    L.marker([48.14735053624901, 16.492216234765525], {icon: industryIcon} ).addTo(industry_new).bindPopup("<p><span style='font-size:12pt;font-weight:bold; color:#0099b8;'>UpHy I</span></p><b>Projektleitung:</b> OMV<br /><b>Standort:</b> Wien<br /><b>Kategorie:</b> Grüne Mobilität<br /><b>Status:</b> laufend<br /><p>Im Project UpHy I wird die Basis für die Demonstration der Wertschöpfungskette für die grüne H2- Mobilität von der Produktion in einer Elektrolyse über die Logistik bis zur 350 bar Betankungsinfrastruktur für eine kommerziell betriebene Buslinie mit Brennstoffzellenantrieb entwickelt.</p><a href='https://www.wiva.at/v2/portfolio-item/uphy-upscaling-of-green-hydrogen-for-mobility-and-industry/'>Details...</a>");

    //Underground Sun.Conversion, laufend, Wiva-Netzwerk
    L.marker([48.028889, 13.691944], {icon: industryIcon} ).addTo(industry_new).bindPopup("<p><span style='font-size:12pt;font-weight:bold; color:#0099b8;'>Underground Sun.Conversion</span></p><b>Projektleitung:</b> RAG Austria AG<br /><b>Standort:</b> Pilsbach<br /><b>Kategorie:</b> Grüne Industrie<br /><b>Status:</b> abgeschlossen<br /><p>Chemical storage of renewable energy in porous subsurface reservoirs with exemplary testbed</p><a href='https://www.underground-sun-conversion.at/'>Details...</a>");

我对每个图层组都这样做。也许这不是最好的方法，但对于我作为一个 java 和 leaflet 初学者来说，这是最简单的方法，我很高兴到目前为止一切顺利;-)

不幸的是，这是一个未解决的用户体验问题。主要问题是，在某些用例中，您需要一个 OR 过滤器（听起来这就是您的情况，因为您的标记在适合相关类别的每个组中都是重复的）；而在其他情况下，您需要一个 AND 过滤器...

因此，如果您想用所有适合的标记填充地图at least一个选定的类别（即实现 OR 过滤器），一种可能的解决方案可能是使用“虚拟”空图层组进行选择控制，每当用户选择发生变化时，清除并使用相关标记重新填充地图。

例如，如果您有地图“overlayadd/remove”事件：

// "Dummy" layers to be used in selection control
const dummy1 = L.layerGroup();
const dummy2 = L.layerGroup();

// Actual categories with possibly common Markers
const category1 = L.layerGroup([markerA, markerB]);
const category2 = L.layerGroup([markerA, markerC]);

// Intermediate group to easily clear map content
const content = L.layerGroup().addTo(map);

map.on("overlayadd overlayremove", () => {
  // Step 1: remove all content
  content.clearLayers();
  // Step 2: re-add layers that fit at least one selection
  if (map.hasLayer(dummy1)) {
    category1.addTo(content)
  }
  if (map.hasLayer(dummy2)) {
    category2.addTo(content)
  }
  // etc.
});

如果您使用 Leaflet.markercluster，您可以简单地将其用作content上面代码片段中的变量。

您还必须为每个项目仅创建 1 个标记，不再为每个类别重复它们。在正常使用情况下，应该避免这种情况，但这里我们专门处理这种情况。例如，如果标记 A 匹配类别 1 和 2，您可以执行以下操作：

L.marker(latLngA).addTo(category1).addTo(category2);