Ulotka: Jak przenieść menu kontroli warstw?

To może być głupie pytanie, ale nie mogłem znaleźć udokumentowanego sposobu na osiągnięcie tego.

Chciałbym dowolnie pozycjonować menu kontroli warstw, prawdopodobnie w lewym górnym rogu obok domyślnego przycisku powiększania / zmniejszania.

Moja kontrola warstw wygląda następująco:

// 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);

Gdzie endpointMarkerLayeri linkLineLayersą warstwy zawierające odpowiednio markery i polilinie.

Czy istnieje opcja określenia, gdzie ma się pojawiać menu? Lub alternatywnie, w jaki sposób mogę uzyskać odniesienie do DOM-objcet menu sterowania, tak że mógłbym przypisać mu niestandardową klasę i zastąpić pozycjonowanie w CSS?

Zgodnie z dokumentami tutaj , możesz przekazać pozycję jako opcję podczas tworzenia kontrolki warstwy.

Dostępne pozycje są przedstawione tutaj

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

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

Odpowiedź Kelso jest poprawna. Jednak dokumentacja (i API) jest nieco myląca. Na przykład, aby utworzyć niestandardowe pole informacyjne na podstawie tego przykładu: http://leafletjs.com/examples/choropleth.html możesz to zrobić:

var mapInfo = L.control({position:'topleft'});

info.onAdd = function (map) {
  this._div = L.DomUtil.create('div', 'info'); // create a div with a class "info"
  this.update();
  return this._div;
};

// method that we will use to update the control based on feature properties passed
info.update = function (props) {
    this._div.innerHTML = '<h4>US Population Density</h4>' +  (props ?
    '<b>' + props.name + '</b><br />' + props.density + ' people / mi<sup>2</sup>'
    : 'Hover over a state');
};

info.addTo(map);

Opcje są ustawione na obiekcie kontrolnym. Można więc pomyśleć , że możesz to zrobić, aby ustawić kontrolę nakładki:

// incorrect
var layerControl = L.control({position:'topleft'}).layers(null, mapOverlays).addTo(map);

Prawidłowym sposobem na to, jak wspomniano powyżej, jest:

// correct
var layerControl = L.control.layers(null, mapOverlays, {position:'topleft'}).addTo(map);