Documentation - Leaflet - a JavaScript library for interactive maps an open-source JavaScript library for mobile-friendly interactive maps Overview Tutorials Docs Download Plugins Blog This reference reflects Leaflet 1.7.1. Check this list if you are using a different version of Leaflet. Leaflet API reference 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 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 Renderer Misc Event objects global switches noConflict 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 var map = L.map('map', { center: [51.505, -0.09], zoom: 13 }); Creation Factory Description L.map( id, options?) Instantiates a map object given the DOM ID of a
element and optionally an object literal with Map options. L.map( el, options?) Instantiates a map object given an instance of a
HTML element and optionally an object literal with Map options. Options Option Type Default Description preferCanvas Boolean false Whether Paths should be rendered on a Canvas renderer. By default, all Paths are rendered in a SVG renderer. Control options Option Type Default Description attributionControl Boolean true Whether a attribution control is added to the map by default. zoomControl Boolean true Whether a zoom control is added to the map by default. Interaction Options Option Type Default Description closePopupOnClick Boolean true Set it to false if you don't want popups to close when user clicks the map. zoomSnap Number 1 Forces the map's zoom level to always be a multiple of this, particularly right after a fitBounds() or a pinch-zoom. By default, the zoom level snaps to the nearest integer; lower values (e.g. 0.5 or 0.1) allow for greater granularity. A value of 0 means the zoom level will not be snapped after fitBounds or a pinch-zoom. zoomDelta Number 1 Controls how much the map's zoom level will change after a zoomIn(), zoomOut(), pressing + or - on the keyboard, or using the zoom controls. Values smaller than 1 (e.g. 0.5) allow for greater granularity. trackResize Boolean true Whether the map automatically handles browser window resize to update itself. boxZoom Boolean true Whether the map can be zoomed to a rectangular area specified by dragging the mouse while pressing the shift key. doubleClickZoom Boolean|String true Whether the map can be zoomed in by double clicking on it and zoomed out by double clicking while holding shift. If passed 'center', double-click zoom will zoom to the center of the view regardless of where the mouse was. dragging Boolean true Whether the map be draggable with mouse/touch or not. Map State Options Option Type Default Description crs CRS L.CRS.EPSG3857 The Coordinate Reference System to use. Don't change this if you're not sure what it means. center LatLng undefined Initial geographic center of the map zoom Number undefined Initial map zoom level minZoom Number * Minimum zoom level of the map. If not specified and at least one GridLayer or TileLayer is in the map, the lowest of their minZoom options will be used instead. maxZoom Number * Maximum zoom level of the map. If not specified and at least one GridLayer or TileLayer is in the map, the highest of their maxZoom options will be used instead. layers Layer[] [] Array of layers that will be added to the map initially maxBounds LatLngBounds null When this option is set, the map restricts the view to the given geographical bounds, bouncing the user back if the user tries to pan outside the view. To set the restriction dynamically, use setMaxBounds method. renderer Renderer * The default method for drawing vector layers on the map. L.SVG or L.Canvas by default depending on browser support. Animation Options Option Type Default Description zoomAnimation Boolean true Whether the map zoom animation is enabled. By default it's enabled in all browsers that support CSS3 Transitions except Android. zoomAnimationThreshold Number 4 Won't animate zoom if the zoom difference exceeds this value. fadeAnimation Boolean true Whether the tile fade animation is enabled. By default it's enabled in all browsers that support CSS3 Transitions except Android. markerZoomAnimation Boolean true Whether markers animate their zoom with the zoom animation, if disabled they will disappear for the length of the animation. By default it's enabled in all browsers that support CSS3 Transitions except Android. transform3DLimit Number 2^23 Defines the maximum size of a CSS translation transform. The default value should not be changed unless a web browser positions layers in the wrong place after doing a large panBy. Panning Inertia Options Option Type Default Description inertia Boolean * If enabled, panning of the map will have an inertia effect where the map builds momentum while dragging and continues moving in the same direction for some time. Feels especially nice on touch devices. Enabled by default unless running on old Android devices. inertiaDeceleration Number 3000 The rate with which the inertial movement slows down, in pixels/second². inertiaMaxSpeed Number Infinity Max speed of the inertial movement, in pixels/second. easeLinearity Number 0.2 worldCopyJump Boolean false With this option enabled, the map tracks when you pan to another "copy" of the world and seamlessly jumps to the original one so that all overlays like markers and vector layers are still visible. maxBoundsViscosity Number 0.0 If maxBounds is set, this option will control how solid the bounds are when dragging the map around. The default value of 0.0 allows the user to drag outside the bounds at normal speed, higher values will slow down map dragging outside bounds, and 1.0 makes the bounds fully solid, preventing the user from dragging outside the bounds. Keyboard Navigation Options Option Type Default Description keyboard Boolean true Makes the map focusable and allows users to navigate the map with keyboard arrows and +/- keys. keyboardPanDelta Number 80 Amount of pixels to pan when pressing an arrow key. Mouse wheel options Option Type Default Description scrollWheelZoom Boolean|String true Whether the map can be zoomed by using the mouse wheel. If passed 'center', it will zoom to the center of the view regardless of where the mouse was. wheelDebounceTime Number 40 Limits the rate at which a wheel can fire (in milliseconds). By default user can't zoom via wheel more often than once per 40 ms. wheelPxPerZoomLevel Number 60 How many scroll pixels (as reported by L.DomEvent.getWheelDelta) mean a change of one full zoom level. Smaller values will make wheel-zooming faster (and vice versa). Touch interaction options Option Type Default Description tap Boolean true Enables mobile hacks for supporting instant taps (fixing 200ms click delay on iOS/Android) and touch holds (fired as contextmenu events). tapTolerance Number 15 The max number of pixels a user can shift his finger during touch for it to be considered a valid tap. touchZoom Boolean|String * Whether the map can be zoomed by touch-dragging with two fingers. If passed 'center', it will zoom to the center of the view regardless of where the touch events (fingers) were. Enabled for touch-capable web browsers except for old Androids. bounceAtZoomLimits Boolean true Set it to false if you don't want the map to zoom beyond min/max zoom and then bounce back when pinch-zooming. Events Layer events Event Data Description baselayerchange LayersControlEvent Fired when the base layer is changed through the layers control. overlayadd LayersControlEvent Fired when an overlay is selected through the layers control. overlayremove LayersControlEvent Fired when an overlay is deselected through the layers control. layeradd LayerEvent Fired when a new layer is added to the map. layerremove LayerEvent Fired when some layer is removed from the map Map state change events Event Data Description zoomlevelschange Event Fired when the number of zoomlevels on the map is changed due to adding or removing a layer. resize ResizeEvent Fired when the map is resized. unload Event Fired when the map is destroyed with remove method. viewreset Event Fired when the map needs to redraw its content (this usually happens on map zoom or load). Very useful for creating custom overlays. load Event Fired when the map is initialized (when its center and zoom are set for the first time). zoomstart Event Fired when the map zoom is about to change (e.g. before zoom animation). movestart Event Fired when the view of the map starts changing (e.g. user starts dragging the map). zoom Event Fired repeatedly during any change in zoom level, including zoom and fly animations. move Event Fired repeatedly during any movement of the map, including pan and fly animations. zoomend Event Fired when the map has changed, after any animations. moveend Event Fired when the center of the map stops changing (e.g. user stopped dragging the map). Popup events Event Data Description popupopen PopupEvent Fired when a popup is opened in the map popupclose PopupEvent Fired when a popup in the map is closed autopanstart Event Fired when the map starts autopanning when opening a popup. Tooltip events Event Data Description tooltipopen TooltipEvent Fired when a tooltip is opened in the map. tooltipclose TooltipEvent Fired when a tooltip in the map is closed. Location events Event Data Description locationerror ErrorEvent Fired when geolocation (using the locate method) failed. locationfound LocationEvent Fired when geolocation (using the locate method) went successfully. Interaction events Event Data Description click MouseEvent Fired when the user clicks (or taps) the map. dblclick MouseEvent Fired when the user double-clicks (or double-taps) the map. mousedown MouseEvent Fired when the user pushes the mouse button on the map. mouseup MouseEvent Fired when the user releases the mouse button on the map. mouseover MouseEvent Fired when the mouse enters the map. mouseout MouseEvent Fired when the mouse leaves the map. mousemove MouseEvent Fired while the mouse moves over the map. contextmenu MouseEvent Fired when the user pushes the right mouse button on the map, prevents default browser context menu from showing if there are listeners on this event. Also fired on mobile when the user holds a single touch for a second (also called long press). keypress KeyboardEvent Fired when the user presses a key from the keyboard that produces a character value while the map is focused. keydown KeyboardEvent Fired when the user presses a key from the keyboard while the map is focused. Unlike the keypress event, the keydown event is fired for keys that produce a character value and for keys that do not produce a character value. keyup KeyboardEvent Fired when the user releases a key from the keyboard while the map is focused. preclick MouseEvent Fired before mouse click on the map (sometimes useful when you want something to happen on click before any existing click handlers start running). Other Events Event Data Description zoomanim ZoomAnimEvent Fired at least once per zoom animation. For continuous zoom, like pinch zooming, fired once per frame during zoom. Methods Method Returns Description getRenderer( layer) Renderer 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 Method Returns Description addControl( control) this Adds the given control to the map removeControl( control) this Removes the given control from the map addLayer( layer) this Adds the given layer to the map removeLayer( layer) this Removes the given layer from the map. hasLayer( layer) Boolean Returns true if the given layer is currently added to the map eachLayer( fn, 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) this Opens the specified popup while closing the previously opened (to make sure only one is opened at one time for usability). openPopup( content, latlng, options?) this Creates a popup with the specified content and options and opens it in the given point on a map. closePopup( popup?) this Closes the popup previously opened with openPopup (or the given one). openTooltip( tooltip) this Opens the specified tooltip. openTooltip( content, latlng, options?) this Creates a tooltip with the specified content and options and open it. closeTooltip( tooltip?) this Closes the tooltip given as parameter. Methods for modifying map state Method Returns Description setView( center, zoom, options?) this Sets the view of the map (geographical center and zoom) with the given animation options. setZoom( zoom, options?) this Sets the zoom of the map. zoomIn( delta?, options?) this Increases the zoom of the map by delta (zoomDelta by default). zoomOut( delta?, options?) this Decreases the zoom of the map by delta (zoomDelta by default). setZoomAround( latlng, zoom, 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( offset, zoom, options) this Zooms the map while keeping a specified pixel on the map (relative to the top-left corner) stationary. fitBounds( bounds, options?) this Sets a map view that contains the given geographical bounds with the maximum zoom level possible. fitWorld( options?) this Sets a map view that mostly contains the whole world with the maximum zoom level possible. panTo( latlng, options?) this Pans the map to a given center. panBy( offset, options?) this Pans the map by a given number of pixels (animated). flyTo( latlng, zoom?, options?) this Sets the view of the map (geographical center and zoom) performing a smooth pan-zoom animation. flyToBounds( bounds, options?) this Sets the view of the map with a smooth animation like flyTo, but takes a bounds parameter like fitBounds. setMaxBounds( bounds) this Restricts the map view to the given bounds (see the maxBounds option). setMinZoom( zoom) this Sets the lower limit for the available zoom levels (see the minZoom option). setMaxZoom( zoom) this Sets the upper limit for the available zoom levels (see the maxZoom option). panInsideBounds( bounds, 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, options?) this Pans the map the minimum amount to make the latlng visible. Use padding, paddingTopLeft and paddingTopRight options to fit the display to more restricted bounds, like fitBounds. If latlng is already within the (optionally padded) display bounds, the map will not be panned. invalidateSize( 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( 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 Method Returns Description locate( options?) this 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 Method Returns Description addHandler( name, HandlerClass) this 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( name, 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( 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( fn, 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 Method Returns Description getCenter() LatLng 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( bounds, inside?, 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( 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 Method Returns Description getZoomScale( toZoom, fromZoom) Number 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( scale, 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, 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, zoom) LatLng Inverse of project. layerPointToLatLng( point) LatLng Given a pixel coordinate relative to the origin pixel, returns the corresponding geographical coordinate (for the current zoom level). latLngToLayerPoint( latlng) Point Given a geographical coordinate, returns the corresponding pixel coordinate relative to the origin pixel. wrapLatLng( 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( 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( latlng1, 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 Given a pixel coordinate relative to the map container, returns the corresponding pixel coordinate relative to the origin pixel. layerPointToContainerPoint( point) Point Given a pixel coordinate relative to the origin pixel, returns the corresponding pixel coordinate relative to the map container. containerPointToLatLng( point) LatLng Given a pixel coordinate relative to the map container, returns the corresponding geographical coordinate (for the current zoom level). latLngToContainerPoint( latlng) Point Given a geographical coordinate, returns the corresponding pixel coordinate relative to the map container. mouseEventToContainerPoint( ev) Point Given a MouseEvent object, returns the pixel coordinate relative to the map container where the event took place. mouseEventToLayerPoint( ev) Point Given a MouseEvent object, returns the pixel coordinate relative to the origin pixel where the event took place. mouseEventToLatLng( ev) LatLng Given a MouseEvent object, returns geographical coordinate where the event took place. ▶ Methods inherited from Evented Method Returns Description on( type, fn, context?) this 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( eventMap) this Adds a set of type/listener pairs, e.g. {click: onClick, mousemove: onMouseMove} off( type, fn?, 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( 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( type, data?, propagate?) this Fires an event of the specified type. You can optionally provide an data object — the first argument of the listener function will contain its properties. The event can optionally be propagated to event parents. listens( type) Boolean Returns true if a particular event type has any listeners attached to it. once(…) this Behaves as on(…), except the listener will only get fired once and then removed. addEventParent( obj) this Adds an event parent - an Evented that will receive propagated events removeEventParent( 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 Property Type Description zoomControl Control.Zoom The default zoom control (only available if the zoomControl option was true when creating the map). Handlers Property Type Description boxZoom Handler Box (shift-drag with mouse) zoom handler. doubleClickZoom Handler Double click zoom handler. dragging Handler Map dragging handler (by both mouse and touch). keyboard Handler Keyboard navigation handler. scrollWheelZoom Handler Scroll wheel zoom handler. tap Handler Mobile touch hacks (quick tap and touch hold) handler. touchZoom Handler Touch zoom handler. 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. Pane Type Z-index Description mapPane HTMLElement 'auto' Pane that contains all other map panes tilePane HTMLElement 200 Pane for GridLayers and TileLayers overlayPane HTMLElement 400 Pane for overlay shadows (e.g. Marker shadows) shadowPane HTMLElement 500 Pane for vectors (Paths, like Polylines and Polygons), ImageOverlays and VideoOverlays markerPane HTMLElement 600 Pane for Icons of Markers tooltipPane HTMLElement 650 Pane for Tooltips. popupPane HTMLElement 700 Pane for Popups. 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: Option Type Default Description watch Boolean false If true, starts continuous watching of location changes (instead of detecting it once) using W3C watchPosition method. You can later stop watching using map.stopLocate() method. setView Boolean false If true, automatically sets the map view to the user location with respect to detection accuracy, or to world view if geolocation failed. maxZoom Number Infinity The maximum zoom for automatic view setting when using setView option. timeout Number 10000 Number of milliseconds to wait for a response from geolocation before firing a locationerror event. maximumAge Number 0 Maximum age of detected location. If less than this amount of milliseconds passed since last geolocation response, locate will return a cached location. enableHighAccuracy Boolean false Enables high accuracy, see description in the W3C spec. 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: Option Type Default Description animate Boolean If not specified, zoom animation will happen if the zoom origin is inside the current view. If true, the map will attempt animating zoom disregarding where zoom origin is. Setting false will make it always reset the view completely without animation. 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: Option Type Default Description animate Boolean If true, panning will always be animated if possible. If false, it will not animate panning, either resetting the map view if panning more than a screen away, or just setting a new offset for the map pane (except for panBy which always does the latter). duration Number 0.25 Duration of animated panning, in seconds. easeLinearity Number 0.25 The curvature factor of panning animation easing (third parameter of the Cubic Bezier curve). 1.0 means linear animation, and the smaller this number, the more bowed the curve. noMoveStart Boolean false If true, panning won't fire movestart event on start (used internally for panning inertia). Zoom/pan options ▶ Options inherited from Zoom options Option Type Default Description animate Boolean If not specified, zoom animation will happen if the zoom origin is inside the current view. If true, the map will attempt animating zoom disregarding where zoom origin is. Setting false will make it always reset the view completely without animation. ▶ Options inherited from Pan options Option Type Default Description duration Number 0.25 Duration of animated panning, in seconds. easeLinearity Number 0.25 The curvature factor of panning animation easing (third parameter of the Cubic Bezier curve). 1.0 means linear animation, and the smaller this number, the more bowed the curve. noMoveStart Boolean false If true, panning won't fire movestart event on start (used internally for panning inertia). FitBounds options Option Type Default Description paddingTopLeft Point [0, 0] Sets the amount of padding in the top left corner of a map container that shouldn't be accounted for when setting the view to fit bounds. Useful if you have some control overlays on the map like a sidebar and you don't want them to obscure objects you're zooming to. paddingBottomRight Point [0, 0] The same for the bottom right corner of the map. padding Point [0, 0] Equivalent of setting both top left and bottom right padding to the same value. maxZoom Number null The maximum possible zoom to use. ▶ Options inherited from Zoom options Option Type Default Description animate Boolean If not specified, zoom animation will happen if the zoom origin is inside the current view. If true, the map will attempt animating zoom disregarding where zoom origin is. Setting false will make it always reset the view completely without animation. ▶ Options inherited from Pan options Option Type Default Description duration Number 0.25 Duration of animated panning, in seconds. easeLinearity Number 0.25 The curvature factor of panning animation easing (third parameter of the Cubic Bezier curve). 1.0 means linear animation, and the smaller this number, the more bowed the curve. noMoveStart Boolean false If true, panning won't fire movestart event on start (used internally for panning inertia). Marker L.Marker is used to display clickable/draggable icons on the map. Extends Layer. Usage example L.marker([50.5, 30.5]).addTo(map); Creation Factory Description L.marker( latlng, options?) Instantiates a Marker object given a geographical point and optionally an options object. Options Option Type Default Description icon Icon * Icon instance to use for rendering the marker. See Icon documentation for details on how to customize the marker icon. If not specified, a common instance of L.Icon.Default is used. keyboard Boolean true Whether the marker can be tabbed to with a keyboard and clicked by pressing enter. title String '' Text for the browser tooltip that appear on marker hover (no tooltip by default). alt String '' Text for the alt attribute of the icon image (useful for accessibility). zIndexOffset Number 0 By default, marker images zIndex is set automatically based on its latitude. Use this option if you want to put the marker on top of all others (or below), specifying a high value like 1000 (or high negative value, respectively). opacity Number 1.0 The opacity of the marker. riseOnHover Boolean false If true, the marker will get on top of others when you hover the mouse over it. riseOffset Number 250 The z-index offset used for the riseOnHover feature. pane String 'markerPane' Map pane where the markers icon will be added. shadowPane String 'shadowPane' Map pane where the markers shadow will be added. bubblingMouseEvents Boolean false When true, a mouse event on this marker will trigger the same event on the map (unless L.DomEvent.stopPropagation is used). Draggable marker options Option Type Default Description draggable Boolean false Whether the marker is draggable with mouse/touch or not. autoPan Boolean false Whether to pan the map when dragging this marker near its edge or not. autoPanPadding Point Point(50, 50) Distance (in pixels to the left/right and to the top/bottom) of the map edge to start panning the map. autoPanSpeed Number 10 Number of pixels the map should pan by. ▶ Options inherited from Interactive layer Option Type Default Description interactive Boolean true If false, the layer will not emit mouse events and will act as a part of the underlying map. ▶ Options inherited from Layer Option Type Default Description attribution String null String to be shown in the attribution control, e.g. "© OpenStreetMap contributors". It describes the layer data and is often a legal obligation towards copyright holders and tile providers. Events Event Data Description move Event Fired when the marker is moved via setLatLng or by dragging. Old and new coordinates are included in event arguments as oldLatLng, latlng. Dragging events Event Data Description dragstart Event Fired when the user starts dragging the marker. movestart Event Fired when the marker starts moving (because of dragging). drag Event Fired repeatedly while the user drags the marker. dragend DragEndEvent Fired when the user stops dragging the marker. moveend Event Fired when the marker stops moving (because of dragging). ▶ Mouse events inherited from Interactive layer Event Data Description click MouseEvent Fired when the user clicks (or taps) the layer. dblclick MouseEvent Fired when the user double-clicks (or double-taps) the layer. mousedown MouseEvent Fired when the user pushes the mouse button on the layer. mouseup MouseEvent Fired when the user releases the mouse button pushed on the layer. mouseover MouseEvent Fired when the mouse enters the layer. mouseout MouseEvent Fired when the mouse leaves the layer. contextmenu MouseEvent Fired when the user right-clicks on the layer, prevents default browser context menu from showing if there are listeners on this event. Also fired on mobile when the user holds a single touch for a second (also called long press). ▶ Events inherited from Layer Event Data Description add Event Fired after the layer is added to a map remove Event Fired after the layer is removed from a map ▶ Popup events inherited from Layer Event Data Description popupopen PopupEvent Fired when a popup bound to this layer is opened popupclose PopupEvent Fired when a popup bound to this layer is closed ▶ Tooltip events inherited from Layer Event Data Description tooltipopen TooltipEvent Fired when a tooltip bound to this layer is opened. tooltipclose TooltipEvent Fired when a tooltip bound to this layer is closed. Methods In addition to shared layer methods like addTo() and remove() and popup methods like bindPopup() you can also use the following methods: Method Returns Description getLatLng() LatLng Returns the current geographical position of the marker. setLatLng( latlng) this Changes the marker position to the given point. setZIndexOffset( offset) this Changes the zIndex offset of the marker. getIcon() Icon Returns the current icon used by the marker setIcon( icon) this Changes the marker icon. setOpacity( opacity) this Changes the opacity of the marker. Other methods Method Returns Description toGeoJSON( precision?) Object precision is the number of decimal places for coordinates. The default value is 6 places. Returns a GeoJSON representation of the marker (as a GeoJSON Point Feature). ▶ Methods inherited from Layer Method Returns Description addTo( map) this 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) this Removes the layer from the given map removeFrom( group) this Removes the layer from the given LayerGroup getPane( 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 Method Returns Description bindPopup( content, options?) this 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?) 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( 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 Method Returns Description bindTooltip( content, options?) this 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?) 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( 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 Method Returns Description on( type, fn, context?) this 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( eventMap) this Adds a set of type/listener pairs, e.g. {click: onClick, mousemove: onMouseMove} off( type, fn?, 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( 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( type, data?, propagate?) this Fires an event of the specified type. You can optionally provide an data object — the first argument of the listener function will contain its properties. The event can optionally be propagated to event parents. listens( type) Boolean Returns true if a particular event type has any listeners attached to it. once(…) this Behaves as on(…), except the listener will only get fired once and then removed. addEventParent( obj) this Adds an event parent - an Evented that will receive propagated events removeEventParent( 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(); Property Type Description dragging Handler Marker dragging handler (by both mouse and touch). Only valid when the marker is on the map (Otherwise set marker.options.draggable). 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. Here's a more complicated way to open a popup on a map: var popup = L.popup() .setLatLng(latlng) .setContent('

Hello world!
This is a nice popup.

') .openOn(map); Creation Factory Description L.popup( options?, source?) Instantiates a Popup object given an optional options object that describes its appearance and location and an optional source object that is used to tag the popup with a reference to the Layer to which it refers. Options Option Type Default Description maxWidth Number 300 Max width of the popup, in pixels. minWidth Number 50 Min width of the popup, in pixels. maxHeight Number null If set, creates a scrollable container of the given height inside a popup if its content exceeds it. autoPan Boolean true Set it to false if you don't want the map to do panning animation to fit the opened popup. autoPanPaddingTopLeft Point null The margin between the popup and the top left corner of the map view after autopanning was performed. autoPanPaddingBottomRight Point null The margin between the popup and the bottom right corner of the map view after autopanning was performed. autoPanPadding Point Point(5, 5) Equivalent of setting both top left and bottom right autopan padding to the same value. keepInView Boolean false Set it to true if you want to prevent users from panning the popup off of the screen while it is open. closeButton Boolean true Controls the presence of a close button in the popup. autoClose Boolean true Set it to false if you want to override the default behavior of the popup closing when another popup is opened. closeOnEscapeKey Boolean true Set it to false if you want to override the default behavior of the ESC key for closing of the popup. closeOnClick Boolean * Set it if you want to override the default behavior of the popup closing when user clicks on the map. Defaults to the map's closePopupOnClick option. className String '' A custom CSS class name to assign to the popup. ▶ Options inherited from DivOverlay Option Type Default Description offset Point Point(0, 7) The offset of the popup position. Useful to control the anchor of the popup when opening it on some overlays. pane String 'popupPane' Map pane where the popup will be added. ▶ Options inherited from Layer Option Type Default Description attribution String null String to be shown in the attribution control, e.g. "© OpenStreetMap contributors". It describes the layer data and is often a legal obligation towards copyright holders and tile providers. Events ▶ Events inherited from Layer Event Data Description add Event Fired after the layer is added to a map remove Event Fired after the layer is removed from a map ▶ Popup events inherited from Layer Event Data Description popupopen PopupEvent Fired when a popup bound to this layer is opened popupclose PopupEvent Fired when a popup bound to this layer is closed ▶ Tooltip events inherited from Layer Event Data Description tooltipopen TooltipEvent Fired when a tooltip bound to this layer is opened. tooltipclose TooltipEvent Fired when a tooltip bound to this layer is closed. Methods Method Returns Description getLatLng() LatLng Returns the geographical point of popup. setLatLng( latlng) this Sets the geographical point where the popup will open. getContent() String|HTMLElement Returns the content of the popup. setContent( htmlContent) this Sets the HTML content of the popup. 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 popup. getElement() String|HTMLElement Returns the HTML container of the popup. update() null Updates the popup content, layout and position. Useful for updating the popup after something inside changed, e.g. image loaded. isOpen() Boolean Returns true when the popup is visible on the map. bringToFront() this Brings this popup in front of other popups (in the same map pane). bringToBack() this Brings this popup to the back of other popups (in the same map pane). openOn( map) this Adds the popup to the map and closes the previous one. The same as map.openPopup(popup). ▶ Methods inherited from Layer Method Returns Description addTo( map) this 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) this Removes the layer from the given map removeFrom( group) this Removes the layer from the given LayerGroup getPane( 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 Method Returns Description bindPopup( content, options?) this 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?) 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( 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 Method Returns Description bindTooltip( content, options?) this 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?) 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( 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 Method Returns Description on( type, fn, context?) this 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( eventMap) this Adds a set of type/listener pairs, e.g. {click: onClick, mousemove: onMouseMove} off( type, fn?, 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( 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( type, data?, propagate?) this Fires an event of the specified type. You can optionally provide an data object — the first argument of the listener function will contain its properties. The event can optionally be propagated to event parents. listens( type) Boolean Returns true if a particular event type has any listeners attached to it. once(…) this Behaves as on(…), except the listener will only get fired once and then removed. addEventParent( obj) this Adds an event parent - an Evented that will receive propagated events removeEventParent( 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 marker.bindTooltip("my tooltip text").openTooltip(); 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. Creation Factory Description L.tooltip( options?, source?) Instantiates a Tooltip object given an optional options object that describes its appearance and location and an optional source object that is used to tag the tooltip with a reference to the Layer to which it refers. Options Option Type Default Description pane String 'tooltipPane' Map pane where the tooltip will be added. offset Point Point(0, 0) Optional offset of the tooltip position. direction String 'auto' Direction where to open the tooltip. Possible values are: right, left, top, bottom, center, auto. auto will dynamically switch between right and left according to the tooltip position on the map. permanent Boolean false Whether to open the tooltip permanently or only on mouseover. sticky Boolean false If true, the tooltip will follow the mouse instead of being fixed at the feature center. interactive Boolean false If true, the tooltip will listen to the feature events. opacity Number 0.9 Tooltip container opacity. ▶ Options inherited from DivOverlay Option Type Default Description className String '' A custom CSS class name to assign to the popup. ▶ Options inherited from Layer Option Type Default Description attribution String null String to be shown in the attribution control, e.g. "© OpenStreetMap contributors". It describes the layer data and is often a legal obligation towards copyright holders and tile providers. Events ▶ Events inherited from Layer Event Data Description add Event Fired after the layer is added to a map remove Event Fired after the layer is removed from a map ▶ Popup events inherited from Layer Event Data Description popupopen PopupEvent Fired when a popup bound to this layer is opened popupclose PopupEvent Fired when a popup bound to this layer is closed ▶ Tooltip events inherited from Layer Event Data Description tooltipopen TooltipEvent Fired when a tooltip bound to this layer is opened. tooltipclose TooltipEvent Fired when a tooltip bound to this layer is closed. Methods ▶ Methods inherited from Layer Method Returns Description addTo( map) this 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) this Removes the layer from the given map removeFrom( group) this Removes the layer from the given LayerGroup getPane( 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 Method Returns Description bindPopup( content, options?) this 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?) 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( 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 Method Returns Description bindTooltip( content, options?) this 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?) 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( 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 Method Returns Description on( type, fn, context?) this 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( eventMap) this Adds a set of type/listener pairs, e.g. {click: onClick, mousemove: onMouseMove} off( type, fn?, 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( 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( type, data?, propagate?) this Fires an event of the specified type. You can optionally provide an data object — the first argument of the listener function will contain its properties. The event can optionally be propagated to event parents. listens( type) Boolean Returns true if a particular event type has any listeners attached to it. once(…) this Behaves as on(…), except the listener will only get fired once and then removed. addEventParent( obj) this Adds an event parent - an Evented that will receive propagated events removeEventParent( 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 L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png?{foo}', {foo: 'bar', attribution: '© OpenStreetMap contributors'}).addTo(map); URL template A string of the following form: 'http://{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: L.tileLayer('http://{s}.somedomain.com/{foo}/{z}/{x}/{y}.png', {foo: 'bar'}); Creation Extension methods Factory Description L.tilelayer( urlTemplate, options?) Instantiates a tile layer object given a URL template and optionally an options object. Options Option Type Default Description minZoom Number 0 The minimum zoom level down to which this layer will be displayed (inclusive). maxZoom Number 18 The maximum zoom level up to which this layer will be displayed (inclusive). subdomains String|String[] 'abc' Subdomains of the tile service. Can be passed in the form of one string (where each letter is a subdomain name) or an array of strings. errorTileUrl String '' URL to the tile image to show in place of the tile that failed to load. zoomOffset Number 0 The zoom number used in tile URLs will be offset with this value. tms Boolean false If true, inverses Y axis numbering for tiles (turn this on for TMS services). zoomReverse Boolean false If set to true, the zoom number used in tile URLs will be reversed (maxZoom - zoom instead of zoom) detectRetina Boolean false If true and user is on a retina display, it will request four tiles of half the specified size and a bigger zoom level in place of one to utilize the high resolution. crossOrigin Boolean|String false Whether the crossOrigin attribute will be added to the tiles. If a String is provided, all tiles will have their crossOrigin attribute set to the String provided. This is needed if you want to access tile pixel data. Refer to CORS Settings for valid String values. ▶ Options inherited from GridLayer Option Type Default Description tileSize Number|Point 256 Width and height of tiles in the grid. Use a number if width and height are equal, or L.point(width, height) otherwise. opacity Number 1.0 Opacity of the tiles. Can be used in the createTile() function. updateWhenIdle Boolean (depends) Load new tiles only when panning ends. true by default on mobile browsers, in order to avoid too many requests and keep smooth navigation. false otherwise in order to display new tiles during panning, since it is easy to pan outside the keepBuffer option in desktop browsers. updateWhenZooming Boolean true By default, a smooth zoom animation (during a touch zoom or a flyTo()) will update grid layers every integer zoom level. Setting this option to false will update the grid layer only when the smooth animation ends. updateInterval Number 200 Tiles will not update more than once every updateInterval milliseconds when panning. zIndex Number 1 The explicit zIndex of the tile layer. bounds LatLngBounds undefined If set, tiles will only be loaded inside the set LatLngBounds. maxNativeZoom Number undefined Maximum zoom number the tile source has available. If it is specified, the tiles on all zoom levels higher than maxNativeZoom will be loaded from maxNativeZoom level and auto-scaled. minNativeZoom Number undefined Minimum zoom number the tile source has available. If it is specified, the tiles on all zoom levels lower than minNativeZoom will be loaded from minNativeZoom level and auto-scaled. noWrap Boolean false Whether the layer is wrapped around the antimeridian. If true, the GridLayer will only be displayed once at low zoom levels. Has no effect when the map CRS doesn't wrap around. Can be used in combination with bounds to prevent requesting tiles outside the CRS limits. pane String 'tilePane' Map pane where the grid layer will be added. className String '' A custom class name to assign to the tile layer. Empty by default. keepBuffer Number 2 When panning the map, keep this many rows and columns of tiles before unloading them. ▶ Options inherited from Layer Option Type Default Description attribution String null String to be shown in the attribution control, e.g. "© OpenStreetMap contributors". It describes the layer data and is often a legal obligation towards copyright holders and tile providers. Events ▶ Events inherited from GridLayer Event Data Description loading Event Fired when the grid layer starts loading tiles. tileunload TileEvent Fired when a tile is removed (e.g. when a tile goes off the screen). tileloadstart TileEvent Fired when a tile is requested and starts loading. tileerror TileErrorEvent Fired when there is an error loading a tile. tileload TileEvent Fired when a tile loads. load Event Fired when the grid layer loaded all visible tiles. ▶ Events inherited from Layer Event Data Description add Event Fired after the layer is added to a map remove Event Fired after the layer is removed from a map ▶ Popup events inherited from Layer Event Data Description popupopen PopupEvent Fired when a popup bound to this layer is opened popupclose PopupEvent Fired when a popup bound to this layer is closed ▶ Tooltip events inherited from Layer Event Data Description tooltipopen TooltipEvent Fired when a tooltip bound to this layer is opened. tooltipclose TooltipEvent Fired when a tooltip bound to this layer is closed. Methods Method Returns Description setUrl( url, noRedraw?) this 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( coords, 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. Method Returns Description getTileUrl( coords) String 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 Method Returns Description bringToFront() this 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( opacity) this Changes the opacity of the grid layer. setZIndex( 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 Method Returns Description addTo( map) this 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) this Removes the layer from the given map removeFrom( group) this Removes the layer from the given LayerGroup getPane( 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 Method Returns Description bindPopup( content, options?) this 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?) 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( 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 Method Returns Description bindTooltip( content, options?) this 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?) 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( 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 Method Returns Description on( type, fn, context?) this 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( eventMap) this Adds a set of type/listener pairs, e.g. {click: onClick, mousemove: onMouseMove} off( type, fn?, 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( 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( type, data?, propagate?) this Fires an event of the specified type. You can optionally provide an data object — the first argument of the listener function will contain its properties. The event can optionally be propagated to event parents. listens( type) Boolean Returns true if a particular event type has any listeners attached to it. once(…) this Behaves as on(…), except the listener will only get fired once and then removed. addEventParent( obj) this Adds an event parent - an Evented that will receive propagated events removeEventParent( 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 var nexrad = L.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" }); Creation Factory Description L.tileLayer.wms( baseUrl, options) Instantiates a WMS tile layer object given a base URL of the WMS service and a WMS parameters/options object. 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. Option Type Default Description layers String '' (required) Comma-separated list of WMS layers to show. styles String '' Comma-separated list of WMS styles. format String 'image/jpeg' WMS image format (use 'image/png' for layers with transparency). transparent Boolean false If true, the WMS service will return images with transparency. version String '1.1.1' Version of the WMS service to use crs CRS null Coordinate Reference System to use for the WMS requests, defaults to map CRS. Don't change this if you're not sure what it means. uppercase Boolean false If true, WMS request parameter keys will be uppercase. ▶ Options inherited from TileLayer Option Type Default Description minZoom Number 0 The minimum zoom level down to which this layer will be displayed (inclusive). maxZoom Number 18 The maximum zoom level up to which this layer will be displayed (inclusive). subdomains String|String[] 'abc' Subdomains of the tile service. Can be passed in the form of one string (where each letter is a subdomain name) or an array of strings. errorTileUrl String '' URL to the tile image to show in place of the tile that failed to load. zoomOffset Number 0 The zoom number used in tile URLs will be offset with this value. tms Boolean false If true, inverses Y axis numbering for tiles (turn this on for TMS services). zoomReverse Boolean false If set to true, the zoom number used in tile URLs will be reversed (maxZoom - zoom instead of zoom) detectRetina Boolean false If true and user is on a retina display, it will request four tiles of half the specified size and a bigger zoom level in place of one to utilize the high resolution. crossOrigin Boolean|String false Whether the crossOrigin attribute will be added to the tiles. If a String is provided, all tiles will have their crossOrigin attribute set to the String provided. This is needed if you want to access tile pixel data. Refer to CORS Settings for valid String values. ▶ Options inherited from GridLayer Option Type Default Description tileSize Number|Point 256 Width and height of tiles in the grid. Use a number if width and height are equal, or L.point(width, height) otherwise. opacity Number 1.0 Opacity of the tiles. Can be used in the createTile() function. updateWhenIdle Boolean (depends) Load new tiles only when panning ends. true by default on mobile browsers, in order to avoid too many requests and keep smooth navigation. false otherwise in order to display new tiles during panning, since it is easy to pan outside the keepBuffer option in desktop browsers. updateWhenZooming Boolean true By default, a smooth zoom animation (during a touch zoom or a flyTo()) will update grid layers every integer zoom level. Setting this option to false will update the grid layer only when the smooth animation ends. updateInterval Number 200 Tiles will not update more than once every updateInterval milliseconds when panning. zIndex Number 1 The explicit zIndex of the tile layer. bounds LatLngBounds undefined If set, tiles will only be loaded inside the set LatLngBounds. maxNativeZoom Number undefined Maximum zoom number the tile source has available. If it is specified, the tiles on all zoom levels higher than maxNativeZoom will be loaded from maxNativeZoom level and auto-scaled. minNativeZoom Number undefined Minimum zoom number the tile source has available. If it is specified, the tiles on all zoom levels lower than minNativeZoom will be loaded from minNativeZoom level and auto-scaled. noWrap Boolean false Whether the layer is wrapped around the antimeridian. If true, the GridLayer will only be displayed once at low zoom levels. Has no effect when the map CRS doesn't wrap around. Can be used in combination with bounds to prevent requesting tiles outside the CRS limits. pane String 'tilePane' Map pane where the grid layer will be added. className String '' A custom class name to assign to the tile layer. Empty by default. keepBuffer Number 2 When panning the map, keep this many rows and columns of tiles before unloading them. ▶ Options inherited from Layer Option Type Default Description attribution String null String to be shown in the attribution control, e.g. "© OpenStreetMap contributors". It describes the layer data and is often a legal obligation towards copyright holders and tile providers. Events ▶ Events inherited from GridLayer Event Data Description loading Event Fired when the grid layer starts loading tiles. tileunload TileEvent Fired when a tile is removed (e.g. when a tile goes off the screen). tileloadstart TileEvent Fired when a tile is requested and starts loading. tileerror TileErrorEvent Fired when there is an error loading a tile. tileload TileEvent Fired when a tile loads. load Event Fired when the grid layer loaded all visible tiles. ▶ Events inherited from Layer Event Data Description add Event Fired after the layer is added to a map remove Event Fired after the layer is removed from a map ▶ Popup events inherited from Layer Event Data Description popupopen PopupEvent Fired when a popup bound to this layer is opened popupclose PopupEvent Fired when a popup bound to this layer is closed ▶ Tooltip events inherited from Layer Event Data Description tooltipopen TooltipEvent Fired when a tooltip bound to this layer is opened. tooltipclose TooltipEvent Fired when a tooltip bound to this layer is closed. Methods Method Returns Description setParams( params, noRedraw?) this 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 Method Returns Description setUrl( url, noRedraw?) this 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( coords, 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 Method Returns Description bringToFront() this 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( opacity) this Changes the opacity of the grid layer. setZIndex( 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 Method Returns Description addTo( map) this 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) this Removes the layer from the given map removeFrom( group) this Removes the layer from the given LayerGroup getPane( 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 Method Returns Description bindPopup( content, options?) this 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?) 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( 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 Method Returns Description bindTooltip( content, options?) this 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?) 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( 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 Method Returns Description on( type, fn, context?) this 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( eventMap) this Adds a set of type/listener pairs, e.g. {click: onClick, mousemove: onMouseMove} off( type, fn?, 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( 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( type, data?, propagate?) this Fires an event of the specified type. You can optionally provide an data object — the first argument of the listener function will contain its properties. The event can optionally be propagated to event parents. listens( type) Boolean Returns true if a particular event type has any listeners attached to it. once(…) this Behaves as on(…), except the listener will only get fired once and then removed. addEventParent( obj) this Adds an event parent - an Evented that will receive propagated events removeEventParent( 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 var imageUrl = 'http://www.lib.utexas.edu/maps/historical/newark_nj_1922.jpg', imageBounds = [[40.712216, -74.22655], [40.773941, -74.12544]]; L.imageOverlay(imageUrl, imageBounds).addTo(map); Creation Factory Description L.imageOverlay( imageUrl, bounds, options?) Instantiates an image overlay object given the URL of the image and the geographical bounds it is tied to. Options Option Type Default Description opacity Number 1.0 The opacity of the image overlay. alt String '' Text for the alt attribute of the image (useful for accessibility). interactive Boolean false If true, the image overlay will emit mouse events when clicked or hovered. crossOrigin Boolean|String false Whether the crossOrigin attribute will be added to the image. If a String is provided, the image will have its crossOrigin attribute set to the String provided. This is needed if you want to access image pixel data. Refer to CORS Settings for valid String values. errorOverlayUrl String '' URL to the overlay image to show in place of the overlay that failed to load. zIndex Number 1 The explicit zIndex of the overlay layer. className String '' A custom class name to assign to the image. Empty by default. ▶ Options inherited from Interactive layer Option Type Default Description bubblingMouseEvents Boolean true When true, a mouse event on this layer will trigger the same event on the map (unless L.DomEvent.stopPropagation is used). ▶ Options inherited from Layer Option Type Default Description pane String 'overlayPane' By default the layer will be added to the map's overlay pane. Overriding this option will cause the layer to be placed on another pane by default. attribution String null String to be shown in the attribution control, e.g. "© OpenStreetMap contributors". It describes the layer data and is often a legal obligation towards copyright holders and tile providers. Events Event Data Description load Event Fired when the ImageOverlay layer has loaded its image error Event Fired when the ImageOverlay layer fails to load its image ▶ Mouse events inherited from Interactive layer Event Data Description click MouseEvent Fired when the user clicks (or taps) the layer. dblclick MouseEvent Fired when the user double-clicks (or double-taps) the layer. mousedown MouseEvent Fired when the user pushes the mouse button on the layer. mouseup MouseEvent Fired when the user releases the mouse button pushed on the layer. mouseover MouseEvent Fired when the mouse enters the layer. mouseout MouseEvent Fired when the mouse leaves the layer. contextmenu MouseEvent Fired when the user right-clicks on the layer, prevents default browser context menu from showing if there are listeners on this event. Also fired on mobile when the user holds a single touch for a second (also called long press). ▶ Events inherited from Layer Event Data Description add Event Fired after the layer is added to a map remove Event Fired after the layer is removed from a map ▶ Popup events inherited from Layer Event Data Description popupopen PopupEvent Fired when a popup bound to this layer is opened popupclose PopupEvent Fired when a popup bound to this layer is closed ▶ Tooltip events inherited from Layer Event Data Description tooltipopen TooltipEvent Fired when a tooltip bound to this layer is opened. tooltipclose TooltipEvent Fired when a tooltip bound to this layer is closed. Methods Method Returns Description setOpacity( opacity) this 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( url) this Changes the URL of the image. setBounds( bounds) this Update the bounds that this ImageOverlay covers setZIndex( 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. ▶ Methods inherited from Layer Method Returns Description addTo( map) this 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) this Removes the layer from the given map removeFrom( group) this Removes the layer from the given LayerGroup getPane( 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 Method Returns Description bindPopup( content, options?) this 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?) 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( 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 Method Returns Description bindTooltip( content, options?) this 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?) 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( 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 Method Returns Description on( type, fn, context?) this 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( eventMap) this Adds a set of type/listener pairs, e.g. {click: onClick, mousemove: onMouseMove} off( type, fn?, 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( 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( type, data?, propagate?) this Fires an event of the specified type. You can optionally provide an data object — the first argument of the listener function will contain its properties. The event can optionally be propagated to event parents. listens( type) Boolean Returns true if a particular event type has any listeners attached to it. once(…) this Behaves as on(…), except the listener will only get fired once and then removed. addEventParent( obj) this Adds an event parent - an Evented that will receive propagated events removeEventParent( 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