Leaflet: Controls layers outside of the map

[bea dieguez]

Hello,

as the title says, i need to put the control layers outside of the map container

is not possible with css: I tried to remove position:relative from the map to try to give an absolute position to the controls layers outside of the container, but it wasn't a good idea...

thank you very much in advance

Bea

[Charlie Geiger]

I was able to achieve this in something I am building right now. It is a web app that provides a completely different UI/UX on mobile vs desktop and I decided to put all the controls inside of a settings menu that the user can open / close.

What I had to do to get it working was:

    var layerControlSettings = new L.control.layers();
    layerControlSettings.addTo(map);
    $('WRAPPER DIV WHERE YOU WANT IT').append(layerControlSettings.onAdd(map)).addClass('mobileSettings');

[amrit karmacharya]

I tried the code and I am getting layer controls in 2 places. One inside the map in its normal place and one in the div i have defined. Clicking on the normal place has no effect, clicking on my div can change the layers. 

How can i remove the layer control from its normal place?

I tried removing the "layerControlSettings.addTo(map);" line, then i get "Uncaught TypeError: Cannot read property 'hasLayer' of undefined"