CODEWITHSUNDEEP
javascriptleaflet
Evan
Evan

Reputation: 2038

Make leaflet layers control with checkboxes, not radio buttons?

Is there an easy way to make a leaflet layers control (L.control.layers) use checkboxes rather than radio buttons?

I have multiple WMS tile layers, and I'd like to be able to have more than one on the map at the same time. For context, the WMS tile layers include bathymetry and contours (topo lines), so it'd be more informative to visualize both at the same time, rather than just having some lines floating in the ocean.

In the leaflet example it says the layers control is "smart enough" to know which to assign radio buttons and which checkboxes, but it'd be nice to have more customized control.

Relevant code:

L.control.layers(WMS, null, {collapsed: false}).addTo(map);
where WMS is multiple L.tileLayer.wms layers.

Upvotes: 4

Views: 11706

Answers (2)

ofir_aghai
ofir_aghai

Reputation: 3311

Here i create an example to demonstrate what ghybs said.

L.control.layers(null, mixed).addTo(map);

Checkout my jsfiddle http://jsfiddle.net/iofirag/Ltub5bgv/18/.

Upvotes: 6

ghybs
ghybs

Reputation: 53215

Pass your WMS as the 2nd argument (i.e. as overlays) instead of the 1st (basemaps) of L.control.layers.

Overlays use check boxes, whereas basemaps use radio buttons.

Upvotes: 10

Related Questions