[GIS] Adding drop-down menu on leaflet map instead of L.control

geojsonjavascriptleaflet

I have created a choropleth map including several layers from the same geojson layer which is turkeyData in my case. I actually did it and it works fine. But I like to change the standard leaflet control appearing on the top-rigt of the window with a drop-down menu. But I don't know how to do it. This is the link to the map.
http://www.mapabase.com/ADNKS/adnks.html

Best Answer

You can still use L.control, you just need to extend it and create the select within the control.

I cannot claim this as my own, but here is a JSFIDDLE.

I found the link as it was reported as an issue in the Leaflet GitHub page.

Notice how you create the innerHTML for the control div:

var div = L.DomUtil.create('div', 'info legend');
div.innerHTML = '<select><option>1</option><option>2</option><option>3</option></select>';
div.firstChild.onmousedown = div.firstChild.ondblclick = L.DomEvent.stopPropagation;
return div;

Hope this helps!