如何添加多组标记？

Question

我需要在我的地图上绘制多层图标。必须通过单击选项面板来呈现或不呈现每组该图标。我找到了所有显示如何添加单个标记或一组标记的示例，但没有关于多个组的示例。

我在 angular 与 Asymmetrik/ngx-leaflet 一起工作，但我认为我缺少的概念适用于所有实施。

  markersLayersLev_1: Marker[] = [];
  markersLayersLev_2: Marker[] = [];
  markersLayersLev_3: Marker[] = [];

我怎样才能把这个 "layers" 单独放在地图上？

Answer 1

好的，我找到了如何完成这个任务。

Marker extends Layer 这样我就可以在 LayerGroup 中插入这些标记。我有各种 layerGroup，每个都有自己的一组标记。

ngx-leaflet leafletLayers 指令接受层数组，所以我将各种 layerGroup 放在 LayerGroup[] 数组中，并将其设置为指令的值。

在 Typescript 文件中：

itemsLevel_1: LayerGroup = new LayerGroup();
itemsLevel_2: LayerGroup = new LayerGroup();

marker1.addTo(itemsLevel_1);
marker2.addTo(itemsLevel_1);

marker3.addTo(itemsLevel_2);
marker4.addTo(itemsLevel_2);

 layerMainGroup: LayerGroup[] = [
    itemsLevel_1,
    itemsLevel_2
  ];

并在 html 页面中：

<div
  id="mapContainer"
  leaflet
  [...]
  [leafletLayers]="layerMainGroup"
></div>

如何添加多组标记？

How to add multiple set of marker?

leaflet

angular-leaflet-directive

ngx-leaflet