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.
Thanks
Don't use strings in the function:
map.removeLayer(EPSLayer);
map.removeLayer(TopoLayer);
Depending on the layer you want to remove.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With