Leaflet - Creating LayerGroups Dynamically

Question

Is it possible to create LayerGroups Dynamically? I'm developing an web map that shows the tree species that exists in the parks, an i'm trying to create a LayerGroup for each species so that with a LayerControl i can hide and show certain species, for the sake of testing, i have been creating LayerGroups like this:

l1 = new L.LayerGroup();
//...
l100 = new L.LayerGroup();

And i'm sure that there is a way to do it depending on the number of species that exists, i have tried:

for (var i = 0; i < numberOfSpecies ; i++) {
  l[i] = new L.LayerGroup();
}

But this way, i cant do this:

l[0].addLayer(marker);

What is the best way to do something like this?

Answer 1

Yes, you can. For example:

var layerGroups = {}

for (var i = 0; i < 3; ++i) {
    layerGroups[i] = L.layerGroup().addTo(map);
}

for (var i = 0; i < 3; ++i) {
    layerGroups[i].addLayer(L.marker([i,i]))
}

You can try it here : https://jsfiddle.net/mckbda9y/6/