I have implemented the below example to show the multiple base layers of map in my application using LeafletJs.

Leaflet JS LayerGroup example

I'm able to successfully implement the same but I'm trying to show same in a single tile image option.

Like for example I have two layers 1. Street Layer 2. Gray scale With the above implementation in getting the below options on the map

Map layer option

Instead I'm trying to implement something like the the one below

enter image description here

So that when the user clicks on the small map icon, it should change the view to the other Layer. As in my case there will always be only two layer.

I have tried to add the pane option but that doesn't seem to be the right option for this behavior. Also I have tried some of the properties mentioned in the below link.

Layer group documentation

Is this feasible with the existing components of Leaflet?

  • Welcome to GIS SE! As a new user, please be sure to take the tour to learn about this site's focused Q&A format. – Andy Dec 4 '18 at 14:54
  • The Layers Control is pretty easy to emulate in your own code - given 2 base layers, add one to the map whilst removing the other and vice versa. – peeebeee Dec 4 '18 at 20:02
  • @peeebeee you mean on a certain user event i should add / remove the layer. But issue is, instead of the radio button panel i want to show a single image. If the user is on A view, the image should show B view, and when the user clicks on the image it should change from A -> B and the image tile from B->A – Sam Sam Dec 5 '18 at 5:04

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.