Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Removing layers from a leaflet map

I am adding multiple layers with various opacities to my leaflet map object like this:

 var TopoLayer = L.esri.dynamicMapLayer("https://gis.in.gov/arcgis/rest/services/Imagery_Basemap/MapServer", {
                        opacity: 0.8,
                        // Tell the map to use a loading control

                        useCors: false
                    }).addTo(map);
   var EPSLayer = L.esri.dynamicMapLayer("https://gis.in.gov/arcgis/rest/services/DOT/EPS_Map_2015/MapServer", {
                    opacity: 1,
                    // Tell the map to use a loading control

                    useCors: false
                }).addTo(map);

Now when a user clicks on a checkbox, I would like remove the layer or add it back. I have tried

                    map.removeLayer("EPSLayer");
                    map.removeLayer("tiles");

However, that didnt fix the issue. Any ideas or pointers that could help would be greatly appreciated.

*** Update I have created a fiddle to show the issue:

https://jsfiddle.net/31gmr4ss/3/

The idea is to click on the tree icon to show the areial view and then switch to the map view when its clicked again.

It appears to work when the tree icon is clicked however the arial view is present when the map is zoomed.

As @Fabrizio has suggested, the remove should not be passed string values, however passing just variable names causes the map to not work at all.

enter image description here

Thanks

like image 704
w2olves Avatar asked Jul 13 '15 14:07

w2olves


1 Answers

Don't use strings in the function:

map.removeLayer(EPSLayer);
map.removeLayer(TopoLayer);

Depending on the layer you want to remove.

like image 183
Fabrizio Mazzoni Avatar answered Oct 30 '22 19:10

Fabrizio Mazzoni