CODEWITHSUNDEEP
javascriptleafletmaps
user12097954
user12097954

Reputation:

Leaflet Adding Dynamic Layers & Markers to Layer

Note: I am using a "L.CRS.Simple" map to have a png as my map background image based on xy points.

Now I am trying to add layers and a layer control from a list I have in an object. For example I have this object where I store some general information about the layer. It works but I'll get to the issue after I show my current code.

var layerGroups = {
    'layer1' : {'icon':'icon1.png', 'name':'Name1'},
    'layer' : {'icon':'icon2.png', 'name':'Name2'},
};

I also have an empty layer control I add to the map that I fill later.

var layerControl = L.control.layers();

//this command is ran later
layerControl.addTo(map);

Then I have this function that adds all the layers from my object.

function addLayers()
{
    for (var layer in layerGroups)
    {
        layerGroups[layer] = L.layerGroup().addTo(map);
    }
}

Edit: I also have this function to add the layers to the control.

function addLayerControl()
{
    for (var layer in layerGroups)
    {
        layerControl.addOverlay(layerGroups[layer], layerGroups[layer]);
    }
    
}

then I have this function that adds a marker to a specific layer.

function addMarker(layer, x, y)
{
    L.marker(xy(x, y)).addTo(map).bindPopup('test').addTo(layerGroups[layer]);
}

That all works and I can see my markers and the layer toggling works. However the layer control says [object Object].

Leaflet map broken layer controls

I tried fixing this by trying to access the "name" parameter of my object in the AddLayers() function but then the map does not work at all.

layerGroups[layer].name = L.layerGroup().addTo(map);

So my question is:

(1) What is the best way to add layers to my map from an object? (Note this object can change and the user can add any layers they want.

(2) Is my method of adding a marker to a layer ok? Is there a better way?

(3) Is there anyway when I use layerGroups[layer] = L.layerGroup().addTo(map); to make the layer hidden by default?

I guess that's all, I will look into changing the marker to my listed image, but for now I just want to make sure my basic addLayers() and addMarker() functions are working as they should.

Thank you very much for reading!

Upvotes: 2

Views: 5190

Answers (1)

ghybs
ghybs

Reputation: 53185

(1) What is the best way to add layers to my map from an object?

You know that in everything, and software is no exception, there is no such thing as "best", only good fit for a context and requirement.

In your case, your way works fine (except for a few adjustments) and does not look overly complex, so it seems fine.

(2) Is my method of adding a marker to a layer ok?

If you are referring to:

L.marker(xy(x, y)).addTo(map).bindPopup('test').addTo(layerGroups[layer]);

...then the addTo(map) is redundant with addTo(layerGroups[layer])

(3) Is there anyway when I use layerGroups[layer] = L.layerGroup().addTo(map); to make the layer hidden by default?

Simply omit the addTo(map) part?

Strangely you mention "the layer control says [object Object]." but do not ask for it. I assume you either solved it or you are planning to ask a separate question for it (as you should).

Upvotes: 1

Related Questions