Leaflet: How to move the layer-control menu?

Question

This might be a silly question, but I could not find a documented way to achieve this.

I'd like to freely position the layer-control menu, probably to the top left near the default zoom-in/out button.

My layer control looks like this:

// Group layers as overlay pane
overlayPane = {
  "Endpoints" : endpointMarkerLayer,
  "Links" : linkLineLayer
};

// Add a layer control element to the map
layerControl = L.control.layers(null, overlayPane);
layerControl.addTo(map);

Where endpointMarkerLayer and linkLineLayer are layers containing markers and polylines respectively.

Is there an option to specify where the menu should appear? Or alternatively, how can I get a reference to the DOM-objcet of the control-menu, such that I could assign it a custom class and override positioning in CSS?

Answer 1

According to the docs here, you can pass the position in as an option when creating the layer control.

Available positions are outlined here

overlayPane = {
  "Endpoints" : endpointMarkerLayer,
  "Links" : linkLineLayer,
};

// Add a layer control element to the map
layerControl = L.control.layers(null, overlayPane, {position: 'topleft'});
layerControl.addTo(map);