L.Control.Layers

Control.Layers

The layers control gives users the ability to switch between different base layers and switch overlays on/off (check out the detailed example). Extends Control.

Usage example

var baseLayers = {
    "Mapbox": mapbox,
    "OpenStreetMap": osm
};
var overlays = {
    "Marker": marker,
    "Roads": roadsLayer
};
L.control.layers(baseLayers, overlays).addTo(map);

The baseLayers and overlays parameters are object literals with layer names as keys and Layer objects as values:

{
    "<someName1>": layer1,
    "<someName2>": layer2
}

The layer names can contain HTML, which allows you to add additional styling to the items:

{"<img src='my-layer-icon' /> <span class='my-layer-item'>My Layer</span>": myLayer}

Creation

Factory	Description
`L.control.layers(<Object> baselayers?, <Object> overlays?, <Control.Layers options> options?)`	Creates an attribution control with the given layers. Base layers will be switched with radio buttons, while overlays will be switched with checkboxes. Note that all base layers should be passed in the base layers object, but only one should be added to the map during map instantiation.

Options

Option	Type	Default	Description
`collapsed`	`Boolean`	`true`	If `true`, the control will be collapsed into an icon and expanded on mouse hover or touch.
`autoZIndex`	`Boolean`	`true`	If `true`, the control will assign zIndexes in increasing order to all of its layers so that the order is preserved when switching them on/off.
`hideSingleBase`	`Boolean`	`false`	If `true`, the base layers in the control will be hidden when there is only one.

▶ Options inherited from Control

Option	Type	Default	Description
`position`	`String`	`'topright'`	The position of the control (one of the map corners). Possible values are `'topleft'`, `'topright'`, `'bottomleft'` or `'bottomright'`

Methods

Method	Returns	Description
`addBaseLayer(<Layer> layer, <String> name)`	`this`	Adds a base layer (radio button entry) with the given name to the control.
`addOverlay(<Layer> layer, <String> name)`	`this`	Adds an overlay (checkbox entry) with the given name to the control.
`removeLayer(<Layer> layer)`	`this`	Remove the given layer from the control.
`expand()`	`this`	Expand the control container if collapsed.
`collapse()`	`this`	Collapse the control container if expanded.

▶ Methods inherited from Control

Method	Returns	Description
`getPosition()`	`string`	Returns the position of the control.
`setPosition(<string> position)`	`this`	Sets the position of the control.
`getContainer()`	`HTMLElement`	Returns the HTMLElement that contains the control.
`addTo(<Map> map)`	`this`	Adds the control to the given map.
`remove()`	`this`	Removes the control from the map it is currently active on.

v1.1.0