LeafletJS. I am trying to have two overlay layers be mutually exclusive. Full example here on jsfiddle
I guess it comes down to this bit of code:
map.on('overlayadd', function(event)
{
console.log( "Clicked on " + event.name )
if ( event.name == "layer1" && map.hasLayer(layer2) ) {
console.log("remove layer2")
map.removeLayer(layer2)
}
if ( event.name == "layer2" && map.hasLayer(layer1) ) {
console.log("remove layer1")
map.removeLayer(layer1)
}
ccontrol._update();
});
It I select just layer2 and then select layer1 it works fine (layer1 becomes selected and shown on map and layer2 toggles to off). The Console shows the sequence of events to be:
- Clicked on layer2
- Clicked on layer1
- remove layer2
But if I select layer1 first, and then try to select layer 2 nothing appears to happen. The console shows the sequence of events to be:
- Clicked on layer1 <-- I manually clicked this
- Clicked on layer2 <-- I manually clicked this
- remove layer1
- Clicked on layer1 <-- This happened automatically ???
- remove layer2
Can anyone shed some light on this?