Reference 2.0.0

--- layout: v2 title: Documentation bodyclass: api-page ---

Leaflet API reference

This reference reflects Leaflet 2.0.0. Check this list if you are using a different version of Leaflet.

Map

• Usage example
• Creation
• Options
• Events

Map Methods

• Modifying map state
• Getting map state
• Layers and controls
• Conversion methods
• Other methods

Map Misc

• Properties
• Panes

UI Layers

• Marker
• DivOverlay
• Popup
• Tooltip

Raster Layers

• TileLayer
• TileLayer.WMS
• ImageOverlay
• VideoOverlay

Vector Layers

• Path
• Polyline
• Polygon
• Rectangle
• Circle
• CircleMarker
• SVGOverlay
• SVG
• Canvas

Other Layers

• LayerGroup
• FeatureGroup
• GeoJSON
• GridLayer

Basic Types

• LatLng
• LatLngBounds
• Point
• Bounds
• Icon
• DivIcon

Controls

• Zoom
• Attribution
• Layers
• Scale

Utility

• Browser
• Util
• Transformation
• LineUtil
• PolyUtil

DOM Utility

• DomEvent
• DomUtil
• PosAnimation
• Draggable

Base Classes

• Class
• Evented
• Layer
• Interactive layer
• Control
• Handler
• Projection
• CRS
• BlanketOverlay
• Renderer

Misc

• Event objects
• Global switches
• version

Map

The central class of the API — it is used to create a map on a page and manipulate it.

Usage example

// initialize the map on the "map" div with a given center and zoom
const map = new Map('map', {
	center: [51.505, -0.09],
	zoom: 13
});

Constructor

Options

Control options

Interaction Options

Panning Inertia Options

Keyboard Navigation Options

Touch interaction options

Mouse wheel options

Map State Options

Animation Options

Events

Layer events

Map state change events

Popup events

Tooltip events

Location events

Interaction events

Other Events

Methods

Returns the instance of Renderer that should be used to render the given Path. It will ensure that the renderer options of the map and paths are respected, and that the renderers do exist on the map.

|

Methods for Layers and Controls

Adds the given control to the map

| | removeControl(<Control> control) | this |

Removes the given control from the map

| | addLayer(<Layer> layer) | this |

Adds the given layer to the map

| | removeLayer(<Layer> layer) | this |

Removes the given layer from the map.

| | hasLayer(<Layer> layer) | Boolean |

Returns true if the given layer is currently added to the map

| | eachLayer(<Function> fn, <Object> context?) | this |

Iterates over the layers of the map, optionally specifying context of the iterator function.

map.eachLayer(function(layer){
    layer.bindPopup('Hello');
});

| | openPopup(<Popup> popup) | this |

Opens the specified popup while closing the previously opened (to make sure only one is opened at one time for usability).

| | openPopup(<String|HTMLElement> content, <LatLng> latlng, <Popup options> options?) | this |

Creates a popup with the specified content and options and opens it in the given point on a map.

| | closePopup(<Popup> popup?) | this |

Closes the popup previously opened with openPopup (or the given one).

| | openTooltip(<Tooltip> tooltip) | this |

Opens the specified tooltip.

| | openTooltip(<String|HTMLElement> content, <LatLng> latlng, <Tooltip options> options?) | this |

Creates a tooltip with the specified content and options and open it.

| | closeTooltip(<Tooltip> tooltip) | this |

Closes the tooltip given as parameter.

|

Methods for modifying map state

Sets the view of the map (geographical center and zoom) with the given animation options.

| | setZoom(<Number> zoom, <Zoom/pan options> options?) | this |

Sets the zoom of the map.

| | zoomIn(<Number> delta?, <Zoom options> options?) | this |

Increases the zoom of the map by delta (zoomDelta by default).

| | zoomOut(<Number> delta?, <Zoom options> options?) | this |

Decreases the zoom of the map by delta (zoomDelta by default).

| | setZoomAround(<LatLng> latlng, <Number> zoom, <Zoom options> options) | this |

Zooms the map while keeping a specified geographical point on the map stationary (e.g. used internally for scroll zoom and double-click zoom).

| | setZoomAround(<Point> offset, <Number> zoom, <Zoom options> options) | this |

Zooms the map while keeping a specified pixel on the map (relative to the top-left corner) stationary.

| | fitBounds(<LatLngBounds> bounds, <fitBounds options> options?) | this |

Sets a map view that contains the given geographical bounds with the maximum zoom level possible.

| | fitWorld(<fitBounds options> options?) | this |

Sets a map view that mostly contains the whole world with the maximum zoom level possible.

| | panTo(<LatLng> latlng, <Pan options> options?) | this |

Pans the map to a given center.

| | panBy(<Point> offset, <Pan options> options?) | this |

Pans the map by a given number of pixels (animated).

| | flyTo(<LatLng> latlng, <Number> zoom?, <Zoom/pan options> options?) | this |

Sets the view of the map (geographical center and zoom) performing a smooth pan-zoom animation.

| | flyToBounds(<LatLngBounds> bounds, <fitBounds options> options?) | this |

Sets the view of the map with a smooth animation like flyTo, but takes a bounds parameter like fitBounds.

| | setMaxBounds(<LatLngBounds> bounds) | this |

Restricts the map view to the given bounds (see the maxBounds option).

| | setMinZoom(<Number> zoom) | this |

Sets the lower limit for the available zoom levels (see the minZoom option).

| | setMaxZoom(<Number> zoom) | this |

Sets the upper limit for the available zoom levels (see the maxZoom option).

| | panInsideBounds(<LatLngBounds> bounds, <Pan options> options?) | this |

Pans the map to the closest view that would lie inside the given bounds (if it's not already), controlling the animation using the options specific, if any.

| | panInside(<LatLng> latlng, <padding options> options?) | this |

Pans the map the minimum amount to make the latlng visible. Use padding options to fit the display to more restricted bounds. If latlng is already within the (optionally padded) display bounds, the map will not be panned.

| | invalidateSize(<Zoom/pan options> options) | this |

Checks if the map container size changed and updates the map if so — call it after you've changed the map size dynamically, also animating pan by default. If options.pan is false, panning will not occur. If options.debounceMoveend is true, it will delay moveend event so that it doesn't happen often even if the method is called many times in a row.

| | invalidateSize(<Boolean> animate) | this |

Checks if the map container size changed and updates the map if so — call it after you've changed the map size dynamically, also animating pan by default.

| | stop() | this |

Stops the currently running panTo or flyTo animation, if any.

|

Geolocation methods

Tries to locate the user using the Geolocation API, firing a locationfound event with location data on success or a locationerror event on failure, and optionally sets the map view to the user's location with respect to detection accuracy (or to the world view if geolocation failed). Note that, if your page doesn't use HTTPS, this method will fail in modern browsers (Chrome 50 and newer) See Locate options for more details.

| | stopLocate() | this |

Stops watching location previously initiated by map.locate({watch: true}) and aborts resetting the map view if map.locate was called with {setView: true}.

|

Other Methods

Adds a new Handler to the map, given its name and constructor function.

| | remove() | this |

Destroys the map and clears all related event listeners.

| | createPane(<String> name, <HTMLElement> container?) | HTMLElement |

Creates a new map pane with the given name if it doesn't exist already, then returns it. The pane is created as a child of container, or as a child of the main map pane if not set.

| | getPane(<String|HTMLElement> pane) | HTMLElement |

Returns a map pane, given its name or its HTML element (its identity).

| | getPanes() | Object |

Returns a plain object containing the names of all panes as keys and the panes as values.

| | getContainer() | HTMLElement |

Returns the HTML element that contains the map.

| | whenReady(<Function> fn, <Object> context?) | this |

Runs the given function fn when the map gets initialized with a view (center and zoom) and at least one layer, or immediately if it's already initialized, optionally passing a function context.

|

Methods for Getting Map State

Returns the geographical center of the map view

| | getZoom() | Number |

Returns the current zoom level of the map view

| | getBounds() | LatLngBounds |

Returns the geographical bounds visible in the current map view

| | getMinZoom() | Number |

Returns the minimum zoom level of the map (if set in the minZoom option of the map or of any layers), or 0 by default.

| | getMaxZoom() | Number |

Returns the maximum zoom level of the map (if set in the maxZoom option of the map or of any layers).

| | getBoundsZoom(<LatLngBounds> bounds, <Boolean> inside?, <Point> padding?) | Number |

Returns the maximum zoom level on which the given bounds fit to the map view in its entirety. If inside (optional) is set to true, the method instead returns the minimum zoom level on which the map view fits into the given bounds in its entirety.

| | getSize() | Point |

Returns the current size of the map container (in pixels).

| | getPixelBounds() | Bounds |

Returns the bounds of the current map view in projected pixel coordinates (sometimes useful in layer and overlay implementations).

| | getPixelOrigin() | Point |

Returns the projected pixel coordinates of the top left point of the map layer (useful in custom layer and overlay implementations).

| | getPixelWorldBounds(<Number> zoom?) | Bounds |

Returns the world's bounds in pixel coordinates for zoom level zoom. If zoom is omitted, the map's current zoom level is used.

|

Conversion Methods

Returns the scale factor to be applied to a map transition from zoom level fromZoom to toZoom. Used internally to help with zoom animations.

| | getScaleZoom(<Number> scale, <Number> fromZoom) | Number |

Returns the zoom level that the map would end up at, if it is at fromZoom level and everything is scaled by a factor of scale. Inverse of getZoomScale.

| | project(<LatLng> latlng, <Number> zoom) | Point |

Projects a geographical coordinate LatLng according to the projection of the map's CRS, then scales it according to zoom and the CRS's Transformation. The result is pixel coordinate relative to the CRS origin.

| | unproject(<Point> point, <Number> zoom) | LatLng |

Inverse of project.

| | layerPointToLatLng(<Point> point) | LatLng |

Given a pixel coordinate relative to the origin pixel, returns the corresponding geographical coordinate (for the current zoom level).

| | latLngToLayerPoint(<LatLng> latlng) | Point |

Given a geographical coordinate, returns the corresponding pixel coordinate relative to the origin pixel.

| | wrapLatLng(<LatLng> latlng) | LatLng |

Returns a LatLng where lat and lng has been wrapped according to the map's CRS's wrapLat and wrapLng properties, if they are outside the CRS's bounds. By default this means longitude is wrapped around the dateline so its value is between -180 and +180 degrees.

| | wrapLatLngBounds(<LatLngBounds> bounds) | LatLngBounds |

Returns a LatLngBounds with the same size as the given one, ensuring that its center is within the CRS's bounds. By default this means the center longitude is wrapped around the dateline so its value is between -180 and +180 degrees, and the majority of the bounds overlaps the CRS's bounds.

| | distance(<LatLng> latlng1, <LatLng> latlng2) | Number |

Returns the distance between two geographical coordinates according to the map's CRS. By default this measures distance in meters.

| | containerPointToLayerPoint(<Point> point) | Point |

Given a pixel coordinate relative to the map container, returns the corresponding pixel coordinate relative to the origin pixel.

| | layerPointToContainerPoint(<Point> point) | Point |

Given a pixel coordinate relative to the origin pixel, returns the corresponding pixel coordinate relative to the map container.

| | containerPointToLatLng(<Point> point) | LatLng |

Given a pixel coordinate relative to the map container, returns the corresponding geographical coordinate (for the current zoom level).

| | latLngToContainerPoint(<LatLng> latlng) | Point |

Given a geographical coordinate, returns the corresponding pixel coordinate relative to the map container.

| | pointerEventToContainerPoint(<PointerEvent> ev) | Point |

Given a PointerEvent object, returns the pixel coordinate relative to the map container where the event took place.

| | pointerEventToLayerPoint(<PointerEvent> ev) | Point |

Given a PointerEvent object, returns the pixel coordinate relative to the origin pixel where the event took place. Given a PointerEvent object, returns geographical coordinate where the event took place.

|

▶ Methods inherited from Evented

Adds a listener function (fn) to a particular event type of the object. You can optionally specify the context of the listener (object the this keyword will point to). You can also pass several space-separated types (e.g. 'click dblclick').

| | on(<Object> eventMap) | this |

Adds a set of type/listener pairs, e.g. {click: onClick, pointermove: onPointerMove}

| | off(<String> type, <Function> fn?, <Object> context?) | this |

Removes a previously added listener function. If no function is specified, it will remove all the listeners of that particular event from the object. Note that if you passed a custom context to on, you must pass the same context to off in order to remove the listener.

| | off(<Object> eventMap) | this |

Removes a set of type/listener pairs.

| | off() | this |

Removes all listeners to all events on the object. This includes implicitly attached events.

| | fire(<String> type, <Object> data?, <Boolean> propagate?) | this |

Fires an event of the specified type. You can optionally provide a data object — the first argument of the listener function will contain its properties. The event can optionally be propagated to event parents.

| | listens(<String> type, <Boolean> propagate?) | Boolean |

Returns true if a particular event type has any listeners attached to it. The verification can optionally be propagated, it will return true if parents have the listener attached to it.

| | once(…) | this |

Behaves as on(…), except the listener will only get fired once and then removed.

| | addEventParent(<Evented> obj) | this |

Adds an event parent - an Evented that will receive propagated events

| | removeEventParent(<Evented> obj) | this |

Removes an event parent, so it will stop receiving propagated events

| | addEventListener(…) | this |

Alias to on(…)

| | removeEventListener(…) | this |

Alias to off(…)

| | clearAllEventListeners(…) | this |

Alias to off()

| | addOneTimeEventListener(…) | this |

Alias to once(…)

| | fireEvent(…) | this |

Alias to fire(…)

| | hasEventListeners(…) | Boolean |

Alias to listens(…)

|

Properties

Controls

Handlers

Map panes

Panes are DOM elements used to control the ordering of layers on the map. You can access panes with map.getPane or map.getPanes methods. New panes can be created with the map.createPane method.

Every map has the following default panes that differ only in zIndex.

Locate options

Some of the geolocation methods for Map take in an options parameter. This is a plain javascript object with the following optional components:

Zoom options

Some of the Map methods which modify the zoom level take in an options parameter. This is a plain javascript object with the following optional components:

Pan options

Some of the Map methods which modify the center of the map take in an options parameter. This is a plain javascript object with the following optional components:

Zoom/pan options

▶ Options inherited from Zoom options

▶ Options inherited from Pan options

Padding options

FitBounds options

▶ Options inherited from Zoom options

▶ Options inherited from Pan options

▶ Options inherited from Padding options

Marker

Marker is used to display clickable/draggable icons on the map. Extends Layer.

Usage example

new Marker([50.5, 30.5]).addTo(map);

Constructor

Options

Draggable marker options

▶ Options inherited from Interactive layer

▶ Options inherited from Layer

Events

Dragging events

▶ Pointer events inherited from Interactive layer

▶ Events inherited from Layer

▶ Popup events inherited from Layer

▶ Tooltip events inherited from Layer

Methods

In addition to shared layer methods like addTo() and remove() and popup methods like bindPopup() you can also use the following methods:

Returns the current geographical position of the marker.

| | setLatLng(<LatLng> latlng) | this |

Changes the marker position to the given point.

| | setZIndexOffset(<Number> offset) | this |

Changes the zIndex offset of the marker.

| | getIcon() | Icon |

Returns the current icon used by the marker

| | setIcon(<Icon> icon) | this |

Changes the marker icon.

| | getElement() | HTMLElement |

Returns the instance of HTMLElement used by Marker layer.

| | setOpacity(<Number> opacity) | this |

Changes the opacity of the marker.

|

Other methods

Coordinates values are rounded with formatNum function with given precision. Returns a GeoJSON representation of the marker (as a GeoJSON Point Feature).

|

▶ Methods inherited from Layer

Adds the layer to the given map or layer group.

| | remove() | this |

Removes the layer from the map it is currently active on.

| | removeFrom(<Map> map) | this |

Removes the layer from the given map

| | removeFrom(<LayerGroup> group) | this |

Removes the layer from the given LayerGroup

| | getPane(<String> name?) | HTMLElement |

Returns the HTMLElement representing the named pane on the map. If name is omitted, returns the pane for this layer.

| | getAttribution() | String |

Used by the attribution control, returns the attribution option.

|

▶ Popup methods inherited from Layer

Binds a popup to the layer with the passed content and sets up the necessary event listeners. If a Function is passed it will receive the layer as the first argument and should return a String or HTMLElement.

| | unbindPopup() | this |

Removes the popup previously bound with bindPopup.

| | openPopup(<LatLng> latlng?) | this |

Opens the bound popup at the specified latlng or at the default popup anchor if no latlng is passed.

| | closePopup() | this |

Closes the popup bound to this layer if it is open.

| | togglePopup() | this |

Opens or closes the popup bound to this layer depending on its current state.

| | isPopupOpen() | boolean |

Returns true if the popup bound to this layer is currently open.

| | setPopupContent(<String|HTMLElement|Popup> content) | this |

Sets the content of the popup bound to this layer.

| | getPopup() | Popup |

Returns the popup bound to this layer.

|

▶ Tooltip methods inherited from Layer

Binds a tooltip to the layer with the passed content and sets up the necessary event listeners. If a Function is passed it will receive the layer as the first argument and should return a String or HTMLElement.

| | unbindTooltip() | this |

Removes the tooltip previously bound with bindTooltip.

| | openTooltip(<LatLng> latlng?) | this |

Opens the bound tooltip at the specified latlng or at the default tooltip anchor if no latlng is passed.

| | closeTooltip() | this |

Closes the tooltip bound to this layer if it is open.

| | toggleTooltip() | this |

Opens or closes the tooltip bound to this layer depending on its current state.

| | isTooltipOpen() | boolean |

Returns true if the tooltip bound to this layer is currently open.

| | setTooltipContent(<String|HTMLElement|Tooltip> content) | this |

Sets the content of the tooltip bound to this layer.

| | getTooltip() | Tooltip |

Returns the tooltip bound to this layer.

|

▶ Methods inherited from Evented

Adds a listener function (fn) to a particular event type of the object. You can optionally specify the context of the listener (object the this keyword will point to). You can also pass several space-separated types (e.g. 'click dblclick').

| | on(<Object> eventMap) | this |

Adds a set of type/listener pairs, e.g. {click: onClick, pointermove: onPointerMove}

| | off(<String> type, <Function> fn?, <Object> context?) | this |

Removes a previously added listener function. If no function is specified, it will remove all the listeners of that particular event from the object. Note that if you passed a custom context to on, you must pass the same context to off in order to remove the listener.

| | off(<Object> eventMap) | this |

Removes a set of type/listener pairs.

| | off() | this |

Removes all listeners to all events on the object. This includes implicitly attached events.

| | fire(<String> type, <Object> data?, <Boolean> propagate?) | this |

Fires an event of the specified type. You can optionally provide a data object — the first argument of the listener function will contain its properties. The event can optionally be propagated to event parents.

| | listens(<String> type, <Boolean> propagate?) | Boolean |

Returns true if a particular event type has any listeners attached to it. The verification can optionally be propagated, it will return true if parents have the listener attached to it.

| | once(…) | this |

Behaves as on(…), except the listener will only get fired once and then removed.

| | addEventParent(<Evented> obj) | this |

Adds an event parent - an Evented that will receive propagated events

| | removeEventParent(<Evented> obj) | this |

Removes an event parent, so it will stop receiving propagated events

| | addEventListener(…) | this |

Alias to on(…)

| | removeEventListener(…) | this |

Alias to off(…)

| | clearAllEventListeners(…) | this |

Alias to off()

| | addOneTimeEventListener(…) | this |

Alias to once(…)

| | fireEvent(…) | this |

Alias to fire(…)

| | hasEventListeners(…) | Boolean |

Alias to listens(…)

|

Properties

Interaction handlers

Interaction handlers are properties of a marker instance that allow you to control interaction behavior in runtime, enabling or disabling certain features such as dragging (see Handler methods). Example:

marker.dragging.disable();

DivOverlay

Base model for Popup and Tooltip. Inherit from it for custom overlays like plugins.

Options

▶ Options inherited from Interactive layer

▶ Options inherited from Layer

Events

DivOverlay events

▶ Pointer events inherited from Interactive layer

▶ Events inherited from Layer

▶ Popup events inherited from Layer

▶ Tooltip events inherited from Layer

Methods

Adds the overlay to the map. Alternative to map.openPopup(popup)/.openTooltip(tooltip).

| | close() | this |

Closes the overlay. Alternative to map.closePopup(popup)/.closeTooltip(tooltip) and layer.closePopup()/.closeTooltip().

| | toggle(<Layer> layer?) | this |

Opens or closes the overlay bound to layer depending on its current state. Argument may be omitted only for overlay bound to layer. Alternative to layer.togglePopup()/.toggleTooltip().

| | getLatLng() | LatLng |

Returns the geographical point of the overlay.

| | setLatLng(<LatLng> latlng) | this |

Sets the geographical point where the overlay will open.

| | getContent() | String|HTMLElement |

Returns the content of the overlay.

| | setContent(<String|HTMLElement|Function> htmlContent) | this |

Sets the HTML content of the overlay. If a function is passed the source layer will be passed to the function. The function should return a String or HTMLElement to be used in the overlay.

| | getElement() | String|HTMLElement |

Returns the HTML container of the overlay.

| | update() | null |

Updates the overlay content, layout and position. Useful for updating the overlay after something inside changed, e.g. image loaded.

| | isOpen() | Boolean |

Returns true when the overlay is visible on the map.

| | bringToFront() | this |

Brings this overlay in front of other overlays (in the same map pane).

| | bringToBack() | this |

Brings this overlay to the back of other overlays (in the same map pane).

|

▶ Methods inherited from Layer

Adds the layer to the given map or layer group.

| | remove() | this |

Removes the layer from the map it is currently active on.

| | removeFrom(<Map> map) | this |

Removes the layer from the given map

| | removeFrom(<LayerGroup> group) | this |

Removes the layer from the given LayerGroup

| | getPane(<String> name?) | HTMLElement |

Returns the HTMLElement representing the named pane on the map. If name is omitted, returns the pane for this layer.

| | getAttribution() | String |

Used by the attribution control, returns the attribution option.

|

▶ Popup methods inherited from Layer

Binds a popup to the layer with the passed content and sets up the necessary event listeners. If a Function is passed it will receive the layer as the first argument and should return a String or HTMLElement.

| | unbindPopup() | this |

Removes the popup previously bound with bindPopup.

| | openPopup(<LatLng> latlng?) | this |

Opens the bound popup at the specified latlng or at the default popup anchor if no latlng is passed.

| | closePopup() | this |

Closes the popup bound to this layer if it is open.

| | togglePopup() | this |

Opens or closes the popup bound to this layer depending on its current state.

| | isPopupOpen() | boolean |

Returns true if the popup bound to this layer is currently open.

| | setPopupContent(<String|HTMLElement|Popup> content) | this |

Sets the content of the popup bound to this layer.

| | getPopup() | Popup |

Returns the popup bound to this layer.

|

▶ Tooltip methods inherited from Layer

Binds a tooltip to the layer with the passed content and sets up the necessary event listeners. If a Function is passed it will receive the layer as the first argument and should return a String or HTMLElement.

| | unbindTooltip() | this |

Removes the tooltip previously bound with bindTooltip.

| | openTooltip(<LatLng> latlng?) | this |

Opens the bound tooltip at the specified latlng or at the default tooltip anchor if no latlng is passed.

| | closeTooltip() | this |

Closes the tooltip bound to this layer if it is open.

| | toggleTooltip() | this |

Opens or closes the tooltip bound to this layer depending on its current state.

| | isTooltipOpen() | boolean |

Returns true if the tooltip bound to this layer is currently open.

| | setTooltipContent(<String|HTMLElement|Tooltip> content) | this |

Sets the content of the tooltip bound to this layer.

| | getTooltip() | Tooltip |

Returns the tooltip bound to this layer.

|

▶ Methods inherited from Evented

Adds a listener function (fn) to a particular event type of the object. You can optionally specify the context of the listener (object the this keyword will point to). You can also pass several space-separated types (e.g. 'click dblclick').

| | on(<Object> eventMap) | this |

Adds a set of type/listener pairs, e.g. {click: onClick, pointermove: onPointerMove}

| | off(<String> type, <Function> fn?, <Object> context?) | this |

Removes a previously added listener function. If no function is specified, it will remove all the listeners of that particular event from the object. Note that if you passed a custom context to on, you must pass the same context to off in order to remove the listener.

| | off(<Object> eventMap) | this |

Removes a set of type/listener pairs.

| | off() | this |

Removes all listeners to all events on the object. This includes implicitly attached events.

| | fire(<String> type, <Object> data?, <Boolean> propagate?) | this |

Fires an event of the specified type. You can optionally provide a data object — the first argument of the listener function will contain its properties. The event can optionally be propagated to event parents.

| | listens(<String> type, <Boolean> propagate?) | Boolean |

Returns true if a particular event type has any listeners attached to it. The verification can optionally be propagated, it will return true if parents have the listener attached to it.

| | once(…) | this |

Behaves as on(…), except the listener will only get fired once and then removed.

| | addEventParent(<Evented> obj) | this |

Adds an event parent - an Evented that will receive propagated events

| | removeEventParent(<Evented> obj) | this |

Removes an event parent, so it will stop receiving propagated events

| | addEventListener(…) | this |

Alias to on(…)

| | removeEventListener(…) | this |

Alias to off(…)

| | clearAllEventListeners(…) | this |

Alias to off()

| | addOneTimeEventListener(…) | this |

Alias to once(…)

| | fireEvent(…) | this |

Alias to fire(…)

| | hasEventListeners(…) | Boolean |

Alias to listens(…)

|

Popup

Used to open popups in certain places of the map. Use Map.openPopup to open popups while making sure that only one popup is open at one time (recommended for usability), or use Map.addLayer to open as many as you want.

Usage example

If you want to just bind a popup to marker click and then open it, it's really easy:

marker.bindPopup(popupContent).openPopup();

Path overlays like polylines also have a bindPopup method.

A popup can be also standalone:

const popup = new Popup()
	.setLatLng(latlng)
	.setContent('<p>Hello world!
This is a nice popup.</p>')
	.openOn(map);

or

const popup = new Popup(latlng, {content: '<p>Hello world!
This is a nice popup.</p>'})
	.openOn(map);

Constructor

Options

▶ Options inherited from DivOverlay

▶ Options inherited from Interactive layer

▶ Options inherited from Layer

Events

▶ DivOverlay events inherited from DivOverlay

▶ Pointer events inherited from Interactive layer

▶ Events inherited from Layer

▶ Popup events inherited from Layer

▶ Tooltip events inherited from Layer

Methods

Alternative to map.openPopup(popup). Adds the popup to the map and closes the previous one.

|

▶ Methods inherited from DivOverlay

Closes the overlay. Alternative to map.closePopup(popup)/.closeTooltip(tooltip) and layer.closePopup()/.closeTooltip().

| | toggle(<Layer> layer?) | this |

Opens or closes the overlay bound to layer depending on its current state. Argument may be omitted only for overlay bound to layer. Alternative to layer.togglePopup()/.toggleTooltip().

| | getLatLng() | LatLng |

Returns the geographical point of the overlay.

| | setLatLng(<LatLng> latlng) | this |

Sets the geographical point where the overlay will open.

| | getContent() | String|HTMLElement |

Returns the content of the overlay.

| | setContent(<String|HTMLElement|Function> htmlContent) | this |

Sets the HTML content of the overlay. If a function is passed the source layer will be passed to the function. The function should return a String or HTMLElement to be used in the overlay.

| | getElement() | String|HTMLElement |

Returns the HTML container of the overlay.

| | update() | null |

Updates the overlay content, layout and position. Useful for updating the overlay after something inside changed, e.g. image loaded.

| | isOpen() | Boolean |

Returns true when the overlay is visible on the map.

| | bringToFront() | this |

Brings this overlay in front of other overlays (in the same map pane).

| | bringToBack() | this |

Brings this overlay to the back of other overlays (in the same map pane).

|

▶ Methods inherited from Layer

Adds the layer to the given map or layer group.

| | remove() | this |

Removes the layer from the map it is currently active on.

| | removeFrom(<Map> map) | this |

Removes the layer from the given map

| | removeFrom(<LayerGroup> group) | this |

Removes the layer from the given LayerGroup

| | getPane(<String> name?) | HTMLElement |

Returns the HTMLElement representing the named pane on the map. If name is omitted, returns the pane for this layer.

| | getAttribution() | String |

Used by the attribution control, returns the attribution option.

|

▶ Popup methods inherited from Layer

Binds a popup to the layer with the passed content and sets up the necessary event listeners. If a Function is passed it will receive the layer as the first argument and should return a String or HTMLElement.

| | unbindPopup() | this |

Removes the popup previously bound with bindPopup.

| | openPopup(<LatLng> latlng?) | this |

Opens the bound popup at the specified latlng or at the default popup anchor if no latlng is passed.

| | closePopup() | this |

Closes the popup bound to this layer if it is open.

| | togglePopup() | this |

Opens or closes the popup bound to this layer depending on its current state.

| | isPopupOpen() | boolean |

Returns true if the popup bound to this layer is currently open.

| | setPopupContent(<String|HTMLElement|Popup> content) | this |

Sets the content of the popup bound to this layer.

| | getPopup() | Popup |

Returns the popup bound to this layer.

|

▶ Tooltip methods inherited from Layer

Binds a tooltip to the layer with the passed content and sets up the necessary event listeners. If a Function is passed it will receive the layer as the first argument and should return a String or HTMLElement.

| | unbindTooltip() | this |

Removes the tooltip previously bound with bindTooltip.

| | openTooltip(<LatLng> latlng?) | this |

Opens the bound tooltip at the specified latlng or at the default tooltip anchor if no latlng is passed.

| | closeTooltip() | this |

Closes the tooltip bound to this layer if it is open.

| | toggleTooltip() | this |

Opens or closes the tooltip bound to this layer depending on its current state.

| | isTooltipOpen() | boolean |

Returns true if the tooltip bound to this layer is currently open.

| | setTooltipContent(<String|HTMLElement|Tooltip> content) | this |

Sets the content of the tooltip bound to this layer.

| | getTooltip() | Tooltip |

Returns the tooltip bound to this layer.

|

▶ Methods inherited from Evented

Adds a listener function (fn) to a particular event type of the object. You can optionally specify the context of the listener (object the this keyword will point to). You can also pass several space-separated types (e.g. 'click dblclick').

| | on(<Object> eventMap) | this |

Adds a set of type/listener pairs, e.g. {click: onClick, pointermove: onPointerMove}

| | off(<String> type, <Function> fn?, <Object> context?) | this |

Removes a previously added listener function. If no function is specified, it will remove all the listeners of that particular event from the object. Note that if you passed a custom context to on, you must pass the same context to off in order to remove the listener.

| | off(<Object> eventMap) | this |

Removes a set of type/listener pairs.

| | off() | this |

Removes all listeners to all events on the object. This includes implicitly attached events.

| | fire(<String> type, <Object> data?, <Boolean> propagate?) | this |

Fires an event of the specified type. You can optionally provide a data object — the first argument of the listener function will contain its properties. The event can optionally be propagated to event parents.

| | listens(<String> type, <Boolean> propagate?) | Boolean |

Returns true if a particular event type has any listeners attached to it. The verification can optionally be propagated, it will return true if parents have the listener attached to it.

| | once(…) | this |

Behaves as on(…), except the listener will only get fired once and then removed.

| | addEventParent(<Evented> obj) | this |

Adds an event parent - an Evented that will receive propagated events

| | removeEventParent(<Evented> obj) | this |

Removes an event parent, so it will stop receiving propagated events

| | addEventListener(…) | this |

Alias to on(…)

| | removeEventListener(…) | this |

Alias to off(…)

| | clearAllEventListeners(…) | this |

Alias to off()

| | addOneTimeEventListener(…) | this |

Alias to once(…)

| | fireEvent(…) | this |

Alias to fire(…)

| | hasEventListeners(…) | Boolean |

Alias to listens(…)

|

Tooltip

Used to display small texts on top of map layers.

Usage example

If you want to just bind a tooltip to marker:

marker.bindTooltip("my tooltip text").openTooltip();

Path overlays like polylines also have a bindTooltip method.

A tooltip can be also standalone:

const tooltip = new Tooltip()
	.setLatLng(latlng)
	.setContent('Hello world!
This is a nice tooltip.')
	.addTo(map);

or

const tooltip = new Tooltip(latlng, {content: 'Hello world!
This is a nice tooltip.'})
	.addTo(map);

Note about tooltip offset. Leaflet takes two options in consideration for computing tooltip offsetting:

• the offset Tooltip option: it defaults to [0, 0], and it's specific to one tooltip. Add a positive x offset to move the tooltip to the right, and a positive y offset to move it to the bottom. Negatives will move to the left and top.
• the tooltipAnchor Icon option: this will only be considered for Marker. You should adapt this value if you use a custom icon.

Constructor

Options

▶ Options inherited from DivOverlay

▶ Options inherited from Interactive layer

▶ Options inherited from Layer

Events

▶ DivOverlay events inherited from DivOverlay

▶ Pointer events inherited from Interactive layer

▶ Events inherited from Layer

▶ Popup events inherited from Layer

▶ Tooltip events inherited from Layer

Methods

▶ Methods inherited from DivOverlay

Adds the overlay to the map. Alternative to map.openPopup(popup)/.openTooltip(tooltip).

| | close() | this |

Closes the overlay. Alternative to map.closePopup(popup)/.closeTooltip(tooltip) and layer.closePopup()/.closeTooltip().

| | toggle(<Layer> layer?) | this |

Opens or closes the overlay bound to layer depending on its current state. Argument may be omitted only for overlay bound to layer. Alternative to layer.togglePopup()/.toggleTooltip().

| | getLatLng() | LatLng |

Returns the geographical point of the overlay.

| | setLatLng(<LatLng> latlng) | this |

Sets the geographical point where the overlay will open.

| | getContent() | String|HTMLElement |

Returns the content of the overlay.

| | setContent(<String|HTMLElement|Function> htmlContent) | this |

Sets the HTML content of the overlay. If a function is passed the source layer will be passed to the function. The function should return a String or HTMLElement to be used in the overlay.

| | getElement() | String|HTMLElement |

Returns the HTML container of the overlay.

| | update() | null |

Updates the overlay content, layout and position. Useful for updating the overlay after something inside changed, e.g. image loaded.

| | isOpen() | Boolean |

Returns true when the overlay is visible on the map.

| | bringToFront() | this |

Brings this overlay in front of other overlays (in the same map pane).

| | bringToBack() | this |

Brings this overlay to the back of other overlays (in the same map pane).

|

▶ Methods inherited from Layer

Adds the layer to the given map or layer group.

| | remove() | this |

Removes the layer from the map it is currently active on.

| | removeFrom(<Map> map) | this |

Removes the layer from the given map

| | removeFrom(<LayerGroup> group) | this |

Removes the layer from the given LayerGroup

| | getPane(<String> name?) | HTMLElement |

Returns the HTMLElement representing the named pane on the map. If name is omitted, returns the pane for this layer.

| | getAttribution() | String |

Used by the attribution control, returns the attribution option.

|

▶ Popup methods inherited from Layer

Binds a popup to the layer with the passed content and sets up the necessary event listeners. If a Function is passed it will receive the layer as the first argument and should return a String or HTMLElement.

| | unbindPopup() | this |

Removes the popup previously bound with bindPopup.

| | openPopup(<LatLng> latlng?) | this |

Opens the bound popup at the specified latlng or at the default popup anchor if no latlng is passed.

| | closePopup() | this |

Closes the popup bound to this layer if it is open.

| | togglePopup() | this |

Opens or closes the popup bound to this layer depending on its current state.

| | isPopupOpen() | boolean |

Returns true if the popup bound to this layer is currently open.

| | setPopupContent(<String|HTMLElement|Popup> content) | this |

Sets the content of the popup bound to this layer.

| | getPopup() | Popup |

Returns the popup bound to this layer.

|

▶ Tooltip methods inherited from Layer

Binds a tooltip to the layer with the passed content and sets up the necessary event listeners. If a Function is passed it will receive the layer as the first argument and should return a String or HTMLElement.

| | unbindTooltip() | this |

Removes the tooltip previously bound with bindTooltip.

| | openTooltip(<LatLng> latlng?) | this |

Opens the bound tooltip at the specified latlng or at the default tooltip anchor if no latlng is passed.

| | closeTooltip() | this |

Closes the tooltip bound to this layer if it is open.

| | toggleTooltip() | this |

Opens or closes the tooltip bound to this layer depending on its current state.

| | isTooltipOpen() | boolean |

Returns true if the tooltip bound to this layer is currently open.

| | setTooltipContent(<String|HTMLElement|Tooltip> content) | this |

Sets the content of the tooltip bound to this layer.

| | getTooltip() | Tooltip |

Returns the tooltip bound to this layer.

|

▶ Methods inherited from Evented

Adds a listener function (fn) to a particular event type of the object. You can optionally specify the context of the listener (object the this keyword will point to). You can also pass several space-separated types (e.g. 'click dblclick').

| | on(<Object> eventMap) | this |

Adds a set of type/listener pairs, e.g. {click: onClick, pointermove: onPointerMove}

| | off(<String> type, <Function> fn?, <Object> context?) | this |

Removes a previously added listener function. If no function is specified, it will remove all the listeners of that particular event from the object. Note that if you passed a custom context to on, you must pass the same context to off in order to remove the listener.

| | off(<Object> eventMap) | this |

Removes a set of type/listener pairs.

| | off() | this |

Removes all listeners to all events on the object. This includes implicitly attached events.

| | fire(<String> type, <Object> data?, <Boolean> propagate?) | this |

Fires an event of the specified type. You can optionally provide a data object — the first argument of the listener function will contain its properties. The event can optionally be propagated to event parents.

| | listens(<String> type, <Boolean> propagate?) | Boolean |

Returns true if a particular event type has any listeners attached to it. The verification can optionally be propagated, it will return true if parents have the listener attached to it.

| | once(…) | this |

Behaves as on(…), except the listener will only get fired once and then removed.

| | addEventParent(<Evented> obj) | this |

Adds an event parent - an Evented that will receive propagated events

| | removeEventParent(<Evented> obj) | this |

Removes an event parent, so it will stop receiving propagated events

| | addEventListener(…) | this |

Alias to on(…)

| | removeEventListener(…) | this |

Alias to off(…)

| | clearAllEventListeners(…) | this |

Alias to off()

| | addOneTimeEventListener(…) | this |

Alias to once(…)

| | fireEvent(…) | this |

Alias to fire(…)

| | hasEventListeners(…) | Boolean |

Alias to listens(…)

|

TileLayer

Used to load and display tile layers on the map. Note that most tile servers require attribution, which you can set under Layer. Extends GridLayer.

Usage example

new TileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png?{foo}', {foo: 'bar', attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'}).addTo(map);

URL template

A string of the following form:

'https://{s}.somedomain.com/blabla/{z}/{x}/{y}{r}.png'

{s} means one of the available subdomains (used sequentially to help with browser parallel requests per domain limitation; subdomain values are specified in options; a, b or c by default, can be omitted), {z} — zoom level, {x} and {y} — tile coordinates. {r} can be used to add "@2x" to the URL to load retina tiles.

You can use custom keys in the template, which will be evaluated from TileLayer options, like this:

new TileLayer('https://{s}.somedomain.com/{foo}/{z}/{x}/{y}.png', {foo: 'bar'});

Constructor

URL template

Options

▶ Options inherited from GridLayer

▶ Options inherited from Layer

Events

Extension methods

▶ Events inherited from GridLayer

▶ Events inherited from Layer

▶ Popup events inherited from Layer

▶ Tooltip events inherited from Layer

Methods

Updates the layer's URL template and redraws it (unless noRedraw is set to true). If the URL does not change, the layer will not be redrawn unless the noRedraw parameter is set to false.

| | createTile(<Object> coords, <Function> done?) | HTMLElement |

Called only internally, overrides GridLayer's createTile() to return an `` HTML element with the appropriate image URL given coords. The done callback is called when the tile has been loaded.

|

Extension methods

Layers extending TileLayer might reimplement the following method.

Called only internally, returns the URL for a tile given its coordinates. Classes extending TileLayer can override this function to provide custom tile URL naming schemes.

|

▶ Methods inherited from GridLayer

Brings the tile layer to the top of all tile layers.

| | bringToBack() | this |

Brings the tile layer to the bottom of all tile layers.

| | getContainer() | HTMLElement |

Returns the HTML element that contains the tiles for this layer.

| | setOpacity(<Number> opacity) | this |

Changes the opacity of the grid layer.

| | setZIndex(<Number> zIndex) | this |

Changes the zIndex of the grid layer.

| | isLoading() | Boolean |

Returns true if any tile in the grid layer has not finished loading.

| | redraw() | this |

Causes the layer to clear all the tiles and request them again.

| | getTileSize() | Point |

Normalizes the tileSize option into a point. Used by the createTile() method.

|

▶ Methods inherited from Layer

Adds the layer to the given map or layer group.

| | remove() | this |

Removes the layer from the map it is currently active on.

| | removeFrom(<Map> map) | this |

Removes the layer from the given map

| | removeFrom(<LayerGroup> group) | this |

Removes the layer from the given LayerGroup

| | getPane(<String> name?) | HTMLElement |

Returns the HTMLElement representing the named pane on the map. If name is omitted, returns the pane for this layer.

| | getAttribution() | String |

Used by the attribution control, returns the attribution option.

|

▶ Popup methods inherited from Layer

Binds a popup to the layer with the passed content and sets up the necessary event listeners. If a Function is passed it will receive the layer as the first argument and should return a String or HTMLElement.

| | unbindPopup() | this |

Removes the popup previously bound with bindPopup.

| | openPopup(<LatLng> latlng?) | this |

Opens the bound popup at the specified latlng or at the default popup anchor if no latlng is passed.

| | closePopup() | this |

Closes the popup bound to this layer if it is open.

| | togglePopup() | this |

Opens or closes the popup bound to this layer depending on its current state.

| | isPopupOpen() | boolean |

Returns true if the popup bound to this layer is currently open.

| | setPopupContent(<String|HTMLElement|Popup> content) | this |

Sets the content of the popup bound to this layer.

| | getPopup() | Popup |

Returns the popup bound to this layer.

|

▶ Tooltip methods inherited from Layer

Binds a tooltip to the layer with the passed content and sets up the necessary event listeners. If a Function is passed it will receive the layer as the first argument and should return a String or HTMLElement.

| | unbindTooltip() | this |

Removes the tooltip previously bound with bindTooltip.

| | openTooltip(<LatLng> latlng?) | this |

Opens the bound tooltip at the specified latlng or at the default tooltip anchor if no latlng is passed.

| | closeTooltip() | this |

Closes the tooltip bound to this layer if it is open.

| | toggleTooltip() | this |

Opens or closes the tooltip bound to this layer depending on its current state.

| | isTooltipOpen() | boolean |

Returns true if the tooltip bound to this layer is currently open.

| | setTooltipContent(<String|HTMLElement|Tooltip> content) | this |

Sets the content of the tooltip bound to this layer.

| | getTooltip() | Tooltip |

Returns the tooltip bound to this layer.

|

▶ Methods inherited from Evented

Adds a listener function (fn) to a particular event type of the object. You can optionally specify the context of the listener (object the this keyword will point to). You can also pass several space-separated types (e.g. 'click dblclick').

| | on(<Object> eventMap) | this |

Adds a set of type/listener pairs, e.g. {click: onClick, pointermove: onPointerMove}

| | off(<String> type, <Function> fn?, <Object> context?) | this |

Removes a previously added listener function. If no function is specified, it will remove all the listeners of that particular event from the object. Note that if you passed a custom context to on, you must pass the same context to off in order to remove the listener.

| | off(<Object> eventMap) | this |

Removes a set of type/listener pairs.

| | off() | this |

Removes all listeners to all events on the object. This includes implicitly attached events.

| | fire(<String> type, <Object> data?, <Boolean> propagate?) | this |

Fires an event of the specified type. You can optionally provide a data object — the first argument of the listener function will contain its properties. The event can optionally be propagated to event parents.

| | listens(<String> type, <Boolean> propagate?) | Boolean |

Returns true if a particular event type has any listeners attached to it. The verification can optionally be propagated, it will return true if parents have the listener attached to it.

| | once(…) | this |

Behaves as on(…), except the listener will only get fired once and then removed.

| | addEventParent(<Evented> obj) | this |

Adds an event parent - an Evented that will receive propagated events

| | removeEventParent(<Evented> obj) | this |

Removes an event parent, so it will stop receiving propagated events

| | addEventListener(…) | this |

Alias to on(…)

| | removeEventListener(…) | this |

Alias to off(…)

| | clearAllEventListeners(…) | this |

Alias to off()

| | addOneTimeEventListener(…) | this |

Alias to once(…)

| | fireEvent(…) | this |

Alias to fire(…)

| | hasEventListeners(…) | Boolean |

Alias to listens(…)

|

TileLayer.WMS

Used to display WMS services as tile layers on the map. Extends TileLayer.

Usage example

const nexrad = new TileLayer.wms("http://mesonet.agron.iastate.edu/cgi-bin/wms/nexrad/n0r.cgi", {
	layers: 'nexrad-n0r-900913',
	format: 'image/png',
	transparent: true,
	attribution: "Weather data © 2012 IEM Nexrad"
});

Constructor

Options

If any custom options not documented here are used, they will be sent to the WMS server as extra parameters in each request URL. This can be useful for non-standard vendor WMS parameters.

▶ Options inherited from TileLayer

▶ Options inherited from GridLayer

▶ Options inherited from Layer

Events

▶ Extension methods inherited from TileLayer

▶ Events inherited from GridLayer

▶ Events inherited from Layer

▶ Popup events inherited from Layer

▶ Tooltip events inherited from Layer

Methods

Merges an object with the new parameters and re-requests tiles on the current screen (unless noRedraw was set to true).

|

▶ Methods inherited from TileLayer

Updates the layer's URL template and redraws it (unless noRedraw is set to true). If the URL does not change, the layer will not be redrawn unless the noRedraw parameter is set to false.

| | createTile(<Object> coords, <Function> done?) | HTMLElement |

Called only internally, overrides GridLayer's createTile() to return an `` HTML element with the appropriate image URL given coords. The done callback is called when the tile has been loaded.

|

▶ Methods inherited from GridLayer

Brings the tile layer to the top of all tile layers.

| | bringToBack() | this |

Brings the tile layer to the bottom of all tile layers.

| | getContainer() | HTMLElement |

Returns the HTML element that contains the tiles for this layer.

| | setOpacity(<Number> opacity) | this |

Changes the opacity of the grid layer.

| | setZIndex(<Number> zIndex) | this |

Changes the zIndex of the grid layer.

| | isLoading() | Boolean |

Returns true if any tile in the grid layer has not finished loading.

| | redraw() | this |

Causes the layer to clear all the tiles and request them again.

| | getTileSize() | Point |

Normalizes the tileSize option into a point. Used by the createTile() method.

|

▶ Methods inherited from Layer

Adds the layer to the given map or layer group.

| | remove() | this |

Removes the layer from the map it is currently active on.

| | removeFrom(<Map> map) | this |

Removes the layer from the given map

| | removeFrom(<LayerGroup> group) | this |

Removes the layer from the given LayerGroup

| | getPane(<String> name?) | HTMLElement |

Returns the HTMLElement representing the named pane on the map. If name is omitted, returns the pane for this layer.

| | getAttribution() | String |

Used by the attribution control, returns the attribution option.

|

▶ Popup methods inherited from Layer

Binds a popup to the layer with the passed content and sets up the necessary event listeners. If a Function is passed it will receive the layer as the first argument and should return a String or HTMLElement.

| | unbindPopup() | this |

Removes the popup previously bound with bindPopup.

| | openPopup(<LatLng> latlng?) | this |

Opens the bound popup at the specified latlng or at the default popup anchor if no latlng is passed.

| | closePopup() | this |

Closes the popup bound to this layer if it is open.

| | togglePopup() | this |

Opens or closes the popup bound to this layer depending on its current state.

| | isPopupOpen() | boolean |

Returns true if the popup bound to this layer is currently open.

| | setPopupContent(<String|HTMLElement|Popup> content) | this |

Sets the content of the popup bound to this layer.

| | getPopup() | Popup |

Returns the popup bound to this layer.

|

▶ Tooltip methods inherited from Layer

Binds a tooltip to the layer with the passed content and sets up the necessary event listeners. If a Function is passed it will receive the layer as the first argument and should return a String or HTMLElement.

| | unbindTooltip() | this |

Removes the tooltip previously bound with bindTooltip.

| | openTooltip(<LatLng> latlng?) | this |

Opens the bound tooltip at the specified latlng or at the default tooltip anchor if no latlng is passed.

| | closeTooltip() | this |

Closes the tooltip bound to this layer if it is open.

| | toggleTooltip() | this |

Opens or closes the tooltip bound to this layer depending on its current state.

| | isTooltipOpen() | boolean |

Returns true if the tooltip bound to this layer is currently open.

| | setTooltipContent(<String|HTMLElement|Tooltip> content) | this |

Sets the content of the tooltip bound to this layer.

| | getTooltip() | Tooltip |

Returns the tooltip bound to this layer.

|

▶ Methods inherited from Evented

Adds a listener function (fn) to a particular event type of the object. You can optionally specify the context of the listener (object the this keyword will point to). You can also pass several space-separated types (e.g. 'click dblclick').

| | on(<Object> eventMap) | this |

Adds a set of type/listener pairs, e.g. {click: onClick, pointermove: onPointerMove}

| | off(<String> type, <Function> fn?, <Object> context?) | this |

Removes a previously added listener function. If no function is specified, it will remove all the listeners of that particular event from the object. Note that if you passed a custom context to on, you must pass the same context to off in order to remove the listener.

| | off(<Object> eventMap) | this |

Removes a set of type/listener pairs.

| | off() | this |

Removes all listeners to all events on the object. This includes implicitly attached events.

| | fire(<String> type, <Object> data?, <Boolean> propagate?) | this |

Fires an event of the specified type. You can optionally provide a data object — the first argument of the listener function will contain its properties. The event can optionally be propagated to event parents.

| | listens(<String> type, <Boolean> propagate?) | Boolean |

Returns true if a particular event type has any listeners attached to it. The verification can optionally be propagated, it will return true if parents have the listener attached to it.

| | once(…) | this |

Behaves as on(…), except the listener will only get fired once and then removed.

| | addEventParent(<Evented> obj) | this |

Adds an event parent - an Evented that will receive propagated events

| | removeEventParent(<Evented> obj) | this |

Removes an event parent, so it will stop receiving propagated events

| | addEventListener(…) | this |

Alias to on(…)

| | removeEventListener(…) | this |

Alias to off(…)

| | clearAllEventListeners(…) | this |

Alias to off()

| | addOneTimeEventListener(…) | this |

Alias to once(…)

| | fireEvent(…) | this |

Alias to fire(…)

| | hasEventListeners(…) | Boolean |

Alias to listens(…)

|

ImageOverlay

Used to load and display a single image over specific bounds of the map. Extends Layer.

Usage example

const imageUrl = 'https://maps.lib.utexas.edu/maps/historical/newark_nj_1922.jpg',
	imageBounds = [[40.712216, -74.22655], [40.773941, -74.12544]];
new ImageOverlay(imageUrl, imageBounds).addTo(map);

Constructor

Options

▶ Options inherited from Interactive layer

▶ Options inherited from Layer

Events

▶ Pointer events inherited from Interactive layer

▶ Events inherited from Layer

▶ Popup events inherited from Layer

▶ Tooltip events inherited from Layer

Methods

Sets the opacity of the overlay.

| | bringToFront() | this |

Brings the layer to the top of all overlays.

| | bringToBack() | this |

Brings the layer to the bottom of all overlays.

| | setUrl(<String> url) | this |

Changes the URL of the image.

| | setBounds(<LatLngBounds> bounds) | this |

Update the bounds that this ImageOverlay covers

| | setZIndex(<Number> value) | this |

Changes the zIndex of the image overlay.

| | getBounds() | LatLngBounds |

Get the bounds that this ImageOverlay covers

| | getElement() | HTMLElement |

Returns the instance of HTMLImageElement used by this overlay.

| | getCenter() | LatLng |

Returns the center of the ImageOverlay.

|

▶ Methods inherited from Layer

Adds the layer to the given map or layer group.

| | remove() | this |

Removes the layer from the map it is currently active on.

| | removeFrom(<Map> map) | this |

Removes the layer from the given map

| | removeFrom(<LayerGroup> group) | this |

Removes the layer from the given LayerGroup

| | getPane(<String> name?) | HTMLElement |

Returns the HTMLElement representing the named pane on the map. If name is omitted, returns the pane for this layer.

| | getAttribution() | String |

Used by the attribution control, returns the attribution option.

|

▶ Popup methods inherited from Layer

Binds a popup to the layer with the passed content and sets up the necessary event listeners. If a Function is passed it will receive the layer as the first argument and should return a String or HTMLElement.

| | unbindPopup() | this |

Removes the popup previously bound with bindPopup.

| | openPopup(<LatLng> latlng?) | this |

Opens the bound popup at the specified latlng or at the default popup anchor if no latlng is passed.

| | closePopup() | this |

Closes the popup bound to this layer if it is open.

| | togglePopup() | this |

Opens or closes the popup bound to this layer depending on its current state.

| | isPopupOpen() | boolean |

Returns true if the popup bound to this layer is currently open.

| | setPopupContent(<String|HTMLElement|Popup> content) | this |

Sets the content of the popup bound to this layer.

| | getPopup() | Popup |

Returns the popup bound to this layer.

|

▶ Tooltip methods inherited from Layer

Binds a tooltip to the layer with the passed content and sets up the necessary event listeners. If a Function is passed it will receive the layer as the first argument and should return a String or HTMLElement.

| | unbindTooltip() | this |

Removes the tooltip previously bound with bindTooltip.

| | openTooltip(<LatLng> latlng?) | this |

Opens the bound tooltip at the specified latlng or at the default tooltip anchor if no latlng is passed.

| | closeTooltip() | this |

Closes the tooltip bound to this layer if it is open.

| | toggleTooltip() | this |

Opens or closes the tooltip bound to this layer depending on its current state.

| | isTooltipOpen() | boolean |

Returns true if the tooltip bound to this layer is currently open.

| | setTooltipContent(<String|HTMLElement|Tooltip> content) | this |

Sets the content of the tooltip bound to this layer.

| | getTooltip() | Tooltip |

Returns the tooltip bound to this layer.

|

▶ Methods inherited from Evented

Adds a listener function (fn) to a particular event type of the object. You can optionally specify the context of the listener (object the this keyword will point to). You can also pass several space-separated types (e.g. 'click dblclick').

| | on(<Object> eventMap) | this |

Adds a set of type/listener pairs, e.g. {click: onClick, pointermove: onPointerMove}

| | off(<String> type, <Function> fn?, <Object> context?) | this |

Removes a previously added listener function. If no function is specified, it will remove all the listeners of that particular event from the object. Note that if you passed a custom context to on, you must pass the same context to off in order to remove the listener.

| | off(<Object> eventMap) | this |

Removes a set of type/listener pairs.

| | off() | this |

Removes all listeners to all events on the object. This includes implicitly attached events.

| | fire(<String> type, <Object> data?, <Boolean> propagate?) | this |

Fires an event of the specified type. You can optionally provide a data object — the first argument of the listener function will contain its properties. The event can optionally be propagated to event parents.

| | listens(<String> type, <Boolean> propagate?) | Boolean |

Returns true if a particular event type has any listeners attached to it. The verification can optionally be propagated, it will return true if parents have the listener attached to it.

| | once(…) | this |

Behaves as on(…), except the listener will only get fired once and then removed.

| | addEventParent(<Evented> obj) | this |

Adds an event parent - an Evented that will receive propagated events

| | removeEventParent(<Evented> obj) | this |

Removes an event parent, so it will stop receiving propagated events

| | addEventListener(…) | this |

Alias to on(…)

| | removeEventListener(…) | this |

Alias to off(…)

| | clearAllEventListeners(…) | this |

Alias to off()

| | addOneTimeEventListener(…) | this |

Alias to once(…)

| | fireEvent(…) | this |

Alias to fire(…)

| | hasEventListeners(…) | Boolean |

Alias to listens(…)

|

VideoOverlay

Used to load and display a video player over specific bounds of the map. Extends ImageOverlay.

A video overlay uses the <video> HTML element.

Usage example

const videoUrl = 'https://www.mapbox.com/bites/00188/patricia_nasa.webm',
	videoBounds = [[32, -130], [13, -100]];
new VideoOverlay(videoUrl, videoBounds ).addTo(map);

Constructor

Options

▶ Options inherited from ImageOverlay

▶ Options inherited from Interactive layer

▶ Options inherited from Layer

Events

▶ Events inherited from ImageOverlay

▶ Pointer events inherited from Interactive layer

▶ Events inherited from Layer

▶ Popup events inherited from Layer

▶ Tooltip events inherited from Layer

Methods

Returns the instance of HTMLVideoElement used by this overlay.

|

▶ Methods inherited from ImageOverlay

Sets the opacity of the overlay.

| | bringToFront() | this |

Brings the layer to the top of all overlays.

| | bringToBack() | this |

Brings the layer to the bottom of all overlays.

| | setUrl(<String> url) | this |

Changes the URL of the image.

| | setBounds(<LatLngBounds> bounds) | this |

Update the bounds that this ImageOverlay covers

| | setZIndex(<Number> value) | this |

Changes the zIndex of the image overlay.

| | getBounds() | LatLngBounds |

Get the bounds that this ImageOverlay covers

| | getCenter() | LatLng |

Returns the center of the ImageOverlay.

|

▶ Methods inherited from Layer

Adds the layer to the given map or layer group.

| | remove() | this |

Removes the layer from the map it is currently active on.

| | removeFrom(<Map> map) | this |

Removes the layer from the given map

| | removeFrom(<LayerGroup> group) | this |

Removes the layer from the given LayerGroup

| | getPane(<String> name?) | HTMLElement |

Returns the HTMLElement representing the named pane on the map. If name is omitted, returns the pane for this layer.

| | getAttribution() | String |

Used by the attribution control, returns the attribution option.

|

▶ Popup methods inherited from Layer

Binds a popup to the layer with the passed content and sets up the necessary event listeners. If a Function is passed it will receive the layer as the first argument and should return a String or HTMLElement.

| | unbindPopup() | this |

Removes the popup previously bound with bindPopup.

| | openPopup(<LatLng> latlng?) | this |

Opens the bound popup at the specified latlng or at the default popup anchor if no latlng is passed.

| | closePopup() | this |

Closes the popup bound to this layer if it is open.

| | togglePopup() | this |

Opens or closes the popup bound to this layer depending on its current state.

| | isPopupOpen() | boolean |

Returns true if the popup bound to this layer is currently open.

| | setPopupContent(<String|HTMLElement|Popup> content) | this |

Sets the content of the popup bound to this layer.

| | getPopup() | Popup |

Returns the popup bound to this layer.

|

▶ Tooltip methods inherited from Layer

Binds a tooltip to the layer with the passed content and sets up the necessary event listeners. If a Function is passed it will receive the layer as the first argument and should return a String or HTMLElement.

| | unbindTooltip() | this |

Removes the tooltip previously bound with bindTooltip.

| | openTooltip(<LatLng> latlng?) | this |

Opens the bound tooltip at the specified latlng or at the default tooltip anchor if no latlng is passed.

| | closeTooltip() | this |

Closes the tooltip bound to this layer if it is open.

| | toggleTooltip() | this |

Opens or closes the tooltip bound to this layer depending on its current state.

| | isTooltipOpen() | boolean |

Returns true if the tooltip bound to this layer is currently open.

| | setTooltipContent(<String|HTMLElement|Tooltip> content) | this |

Sets the content of the tooltip bound to this layer.

| | getTooltip() | Tooltip |

Returns the tooltip bound to this layer.

|

▶ Methods inherited from Evented

Adds a listener function (fn) to a particular event type of the object. You can optionally specify the context of the listener (object the this keyword will point to). You can also pass several space-separated types (e.g. 'click dblclick').

| | on(<Object> eventMap) | this |

Adds a set of type/listener pairs, e.g. {click: onClick, pointermove: onPointerMove}

| | off(<String> type, <Function> fn?, <Object> context?) | this |

Removes a previously added listener function. If no function is specified, it will remove all the listeners of that particular event from the object. Note that if you passed a custom context to on, you must pass the same context to off in order to remove the listener.

| | off(<Object> eventMap) | this |

Removes a set of type/listener pairs.

| | off() | this |

Removes all listeners to all events on the object. This includes implicitly attached events.

| | fire(<String> type, <Object> data?, <Boolean> propagate?) | this |

Fires an event of the specified type. You can optionally provide a data object — the first argument of the listener function will contain its properties. The event can optionally be propagated to event parents.

| | listens(<String> type, <Boolean> propagate?) | Boolean |

Returns true if a particular event type has any listeners attached to it. The verification can optionally be propagated, it will return true if parents have the listener attached to it.

| | once(…) | this |

Behaves as on(…), except the listener will only get fired once and then removed.

| | addEventParent(<Evented> obj) | this |

Adds an event parent - an Evented that will receive propagated events

| | removeEventParent(<Evented> obj) | this |

Removes an event parent, so it will stop receiving propagated events

| | addEventListener(…) | this |

Alias to on(…)

| | removeEventListener(…) | this |

Alias to off(…)

| | clearAllEventListeners(…) | this |

Alias to off()

| | addOneTimeEventListener(…) | this |

Alias to once(…)

| | fireEvent(…) | this |

Alias to fire(…)

| | hasEventListeners(…) | Boolean |

Alias to listens(…)

|

SVGOverlay

Used to load, display and provide DOM access to an SVG file over specific bounds of the map. Extends ImageOverlay.

An SVG overlay uses the <svg> element.

Usage example

const svgElement = document.createElementNS("http://www.w3.org/2000/svg", "svg");
svgElement.setAttribute('xmlns', "http://www.w3.org/2000/svg");
svgElement.setAttribute('viewBox', "0 0 200 200");
svgElement.innerHTML = '<rect width="200" height="200"/><rect x="75" y="23" width="50" height="50" style="fill:red"/><rect x="75" y="123" width="50" height="50" style="fill:#0013ff"/>';
const svgElementBounds = [[ 32, -130], [13, -100] ];
new SVGOverlay(svgElement, svgElementBounds).addTo(map);

Constructor

Options

▶ Options inherited from ImageOverlay

▶ Options inherited from Interactive layer

▶ Options inherited from Layer

Events

▶ Events inherited from ImageOverlay

▶ Pointer events inherited from Interactive layer

▶ Events inherited from Layer

▶ Popup events inherited from Layer

▶ Tooltip events inherited from Layer

Methods

Returns the instance of SVGElement used by this overlay.

|

▶ Methods inherited from ImageOverlay

Sets the opacity of the overlay.

| | bringToFront() | this |

Brings the layer to the top of all overlays.

| | bringToBack() | this |

Brings the layer to the bottom of all overlays.

| | setUrl(<String> url) | this |

Changes the URL of the image.

| | setBounds(<LatLngBounds> bounds) | this |

Update the bounds that this ImageOverlay covers

| | setZIndex(<Number> value) | this |

Changes the zIndex of the image overlay.

| | getBounds() | LatLngBounds |

Get the bounds that this ImageOverlay covers

| | getCenter() | LatLng |

Returns the center of the ImageOverlay.

|

▶ Methods inherited from Layer

Adds the layer to the given map or layer group.

| | remove() | this |

Removes the layer from the map it is currently active on.

| | removeFrom(<Map> map) | this |

Removes the layer from the given map

| | removeFrom(<LayerGroup> group) | this |

Removes the layer from the given LayerGroup

| | getPane(<String> name?) | HTMLElement |

Returns the HTMLElement representing the named pane on the map. If name is omitted, returns the pane for this layer.

| | getAttribution() | String |

Used by the attribution control, returns the attribution option.

|

▶ Popup methods inherited from Layer

Binds a popup to the layer with the passed content and sets up the necessary event listeners. If a Function is passed it will receive the layer as the first argument and should return a String or HTMLElement.

| | unbindPopup() | this |

Removes the popup previously bound with bindPopup.

| | openPopup(<LatLng> latlng?) | this |

Opens the bound popup at the specified latlng or at the default popup anchor if no latlng is passed.

| | closePopup() | this |

Closes the popup bound to this layer if it is open.

| | togglePopup() | this |

Opens or closes the popup bound to this layer depending on its current state.

| | isPopupOpen() | boolean |

Returns true if the popup bound to this layer is currently open.

| | setPopupContent(<String|HTMLElement|Popup> content) | this |

Sets the content of the popup bound to this layer.

| | getPopup() | Popup |

Returns the popup bound to this layer.

|

▶ Tooltip methods inherited from Layer

Binds a tooltip to the layer with the passed content and sets up the necessary event listeners. If a Function is passed it will receive the layer as the first argument and should return a String or HTMLElement.

| | unbindTooltip() | this |

Removes the tooltip previously bound with bindTooltip.

| | openTooltip(<LatLng> latlng?) | this |

Opens the bound tooltip at the specified latlng or at the default tooltip anchor if no latlng is passed.

| | closeTooltip() | this |

Closes the tooltip bound to this layer if it is open.

| | toggleTooltip() | this |

Opens or closes the tooltip bound to this layer depending on its current state.

| | isTooltipOpen() | boolean |

Returns true if the tooltip bound to this layer is currently open.

| | setTooltipContent(<String|HTMLElement|Tooltip> content) | this |

Sets the content of the tooltip bound to this layer.

| | getTooltip() | Tooltip |

Returns the tooltip bound to this layer.

|

▶ Methods inherited from Evented

Adds a listener function (fn) to a particular event type of the object. You can optionally specify the context of the listener (object the this keyword will point to). You can also pass several space-separated types (e.g. 'click dblclick').

| | on(<Object> eventMap) | this |

Adds a set of type/listener pairs, e.g. {click: onClick, pointermove: onPointerMove}

| | off(<String> type, <Function> fn?, <Object> context?) | this |

Removes a previously added listener function. If no function is specified, it will remove all the listeners of that particular event from the object. Note that if you passed a custom context to on, you must pass the same context to off in order to remove the listener.

| | off(<Object> eventMap) | this |

Removes a set of type/listener pairs.

| | off() | this |

Removes all listeners to all events on the object. This includes implicitly attached events.

| | fire(<String> type, <Object> data?, <Boolean> propagate?) | this |

Fires an event of the specified type. You can optionally provide a data object — the first argument of the listener function will contain its properties. The event can optionally be propagated to event parents.

| | listens(<String> type, <Boolean> propagate?) | Boolean |

Returns true if a particular event type has any listeners attached to it. The verification can optionally be propagated, it will return true if parents have the listener attached to it.

| | once(…) | this |

Behaves as on(…), except the listener will only get fired once and then removed.

| | addEventParent(<Evented> obj) | this |

Adds an event parent - an Evented that will receive propagated events

| | removeEventParent(<Evented> obj) | this |

Removes an event parent, so it will stop receiving propagated events

| | addEventListener(…) | this |

Alias to on(…)

| | removeEventListener(…) | this |

Alias to off(…)

| | clearAllEventListeners(…) | this |

Alias to off()

| | addOneTimeEventListener(…) | this |

Alias to once(…)

| | fireEvent(…) | this |

Alias to fire(…)

| | hasEventListeners(…) | Boolean |

Alias to listens(…)

|

Path

An abstract class that contains options and constants shared between vector overlays (Polygon, Polyline, Circle). Do not use it directly. Extends Layer.

Options