New Switching Map Labels Inwards Leaflet


Over the concluding few days I've been experimenting amongst Map Panes inwards Leafet.js. There is a prissy introduction to Map Panes inwards the Leaflet documentation if you lot desire to larn to a greater extent than almost how they piece of employment inwards the Leaflet interactive map library.

In a postal service yesterday I looked at how you lot could locomote Map Panes to fade map labels inwards together with out on altitude of a base of operations map. Today I started thinking almost why you lot powerfulness desire to locomote this characteristic on a map. One argue powerfulness survive to switch betwixt 2 dissimilar sets of map labels. Using this characteristic you lot could take ane gear upwardly of map labels together with so add together a completely dissimilar gear upwardly of map labels to a map.

By guide chances a few days agone I created a gear upwardly of custom map labels for an Urban Dictionary Map of San Francisco. I convey at ane time added 2 buttons to this map to allow you lot to switch betwixt existent map labels together with my custom map labels based on the Urban Dictionary Definition of Bay Area locations.

The Urban Dictionary Map of San Francisco has 3 base of operations map layers; CartoDB's Light (no labels) map style, a custom made Urban Dictionary labels map together with CartoDB's Light - Only Labels map style.

Map Panes inwards Leaflet allows you lot to gild map pane layers. In the Urban Dictionary map CartoDB's Light maps is on the bottom together with the 2 label entirely map styles sit down on altitude of this layer. I so accommodate the opacity of the 2 label map layers to switch betwixt the 2 sets of labels. All 3 map layers are thence introduce at all times. It is only that the opacity of ane of the 2 map labels layers is e'er gear upwardly to '0', so at anyone fourth dimension you lot tin entirely come across the map information layer together with ane of the 2 label layers.

You powerfulness discovery that I've too used JQuery to add together a fade upshot when you lot switch betwixt the 2 sets of map labels. When switching betwixt labels the opacity of the active label layer fades from '100' to '0' earlier switching the opacity of the other label layer to '100'.
Buat lebih berguna, kongsi:
close