closePopupOnClickBooleantruefalse if you don't want popups to close when user clicks the map.false if you don't want popups to close when user clicks the map.worldCopyJumpcontextmenuMouseEvent
- preclickEvent
autopanstartEvent
+ layeraddLayerEvent
@@ -429,72 +437,72 @@ var map = L.map('map', {
setView( <LatLng> center, <Number> zoom, <Boolean> forceReset? ) thisforceReset is set to true, the map is reloaded even if it's eligible for pan or zoom animation (false by default).thisforceReset is set to true, the map is reloaded even if it's eligible for pan or zoom animation (false by default).setZoom( <Number> zoom ) thisthiszoomIn()thisthiszoomOut()thisthisfitBounds( <LatLngBounds> bounds ) thisthisfitWorld()thisthispanTo( <LatLng> latlng ) thisthispanInsideBounds( <LatLngBounds> bounds ) thisthispanBy( <Point> point ) thisthisinvalidateSize()thisthissetMaxBounds( <LatLngBounds> bounds ) thisthislocate( <Locate options> options? ) thisthislocationfound event with location data on success or locationerror event on failure. See Locate options for more details.locateAndSetView( <Number> maxZoom?, <Locate options> options? ) thisthismap.locate({setView: true, maxZoom: maxZoom});.stopLocate()thisthismap.locate({watch: true}).getBoundsZoom( <LatLngBounds> bounds, <Boolean> inside? ) Numberinside (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.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()addLayer( <ILayer> layer, <Boolean> insertAtTheBottom? ) thisinsertAtTheBottom is set to true, the layer is inserted under all others (useful when switching base tile layers).thisinsertAtTheBottom is set to true, the layer is inserted under all others (useful when switching base tile layers).removeLayer( <ILayer> layer ) thisthishasLayer( <ILayer> layer ) Booleantrue if the given layer is currently added to the map.true if the given layer is currently added to the map.openPopup( <Popup> popup ) thisthisclosePopup()thisthisaddControl( <IControl> control ) thisthisremoveControl( <IControl> control ) thisthisPointlatLngToContainerPoint( <LatLng> latlng ) PointcontainerPointToLatLng( <Point> point ) LatLngproject( <LatLng> latlng, <Number> zoom? ) PointwatchBooleanfalsetrue, starts continous watching of location changes (instead of detecting it once) using W3C watchPosition method. You can later stop watching using map.stopLocate() method.true, starts continous watching of location changes (instead of detecting it once) using W3C watchPosition method. You can later stop watching using map.stopLocate() method.setViewBooleanfalsetrue, automatically sets the map view to the user location with respect to detection accuracy.true, automatically sets the map view to the user location with respect to detection accuracy.maxZoomclickableBooleantruefalse, the marker will not emit mouse events and will act as a part of the underlying map.false, the marker will not emit mouse events and will act as a part of the underlying map.draggable01000 (or high negative value, respectively).opacityNumber1.0addTo( <Map> map ) thisgetLatLng()LatLngsetLatLng( <LatLng> latlng ) thisthissetIcon( <Icon> icon ) thisthissetZIndexOffset( <Number> offset ) thisthissetOpacity( <Number> opacity ) thisupdate()thislatLng object were changed directly.bindPopup( <String> htmlContent, <Popup options> options? ) thisthisunbindPopup()thisthisbindPopup.openPopup()thisthisclosePopup()thisthis50maxHeightNumbernullautoPanBooleantruefalse if you don't want the map to do panning animation to fit the opened popup.false if you don't want the map to do panning animation to fit the opened popup.closeButtonaddTo( |
+ this |
+ Adds the popup to the map. | +|
| Method | Returns | @@ -1126,12 +1176,12 @@ var map = L.map('map', {||
|---|---|---|---|
setLatLng( |
- this |
+ this |
Sets the geographical point where the popup will open. |
setContent( |
- this |
+ this |
Sets the HTML content of the popup. |
tmsBooleanfalsetrue, inverses Y axis numbering for tiles (turn this on for TMS services).true, inverses Y axis numbering for tiles (turn this on for TMS services).continuousWorldBooleanfalsetrue, the tile coordinates won't be wrapped by world width (-180 to 180 longitude) or clamped to lie within world height (-90 to 90). Use this if you use Leaflet for maps that don't reflect the real world (e.g. game, indoor or photo maps).true, the tile coordinates won't be wrapped by world width (-180 to 180 longitude) or clamped to lie within world height (-90 to 90). Use this if you use Leaflet for maps that don't reflect the real world (e.g. game, indoor or photo maps).noWrapBooleanfalsetrue, the tiles just won't load outside the world width (-180 to 180 longitude) instead of repeating.true, the tiles just won't load outside the world width (-180 to 180 longitude) instead of repeating.zoomOffsetzoomReverseBooleanfalsetrue, the zoom number used in tile URLs will be reversed (maxZoom - zoom instead of zoom)true, the zoom number used in tile URLs will be reversed (maxZoom - zoom instead of zoom)opacityunloadInvisibleTilesBooleantrue, all the tiles that are not visible after panning are removed (for better performance). true by default on mobile WebKit, otherwise false.true, all the tiles that are not visible after panning are removed (for better performance). true by default on mobile WebKit, otherwise false.updateWhenIdleBooleanfalse, new tiles are loaded during panning, otherwise only after it (for better performance). true by default on mobile WebKit, otherwise false.false, new tiles are loaded during panning, otherwise only after it (for better performance). true by default on mobile WebKit, otherwise false.reuseTilesBooleanfalsetrue, all the tiles that are not visible after panning are placed in a reuse queue from which they will be fetched when new tiles become visible (as opposed to dynamically creating new ones). This will in theory keep memory usage low and eliminate the need for reserving new memory whenever a new tile is needed.true, all the tiles that are not visible after panning are placed in a reuse queue from which they will be fetched when new tiles become visible (as opposed to dynamically creating new ones). This will in theory keep memory usage low and eliminate the need for reserving new memory whenever a new tile is needed.addTo( <Map> map ) thissetOpacity( <Number> opacity ) thisthisUsed to display WMS services as tile layers on the map. Extends TileLayer, implements ILayer interface.
+Used to display WMS services as tile layers on the map. Extends TileLayer.
transparentBooleanfalsetrue, the WMS service will return images with transparency.true, the WMS service will return images with transparency.version| Method | +Returns | +Description | +
|---|---|---|
setParams( |
+ this |
+ Merges an object with the new parameters and re-requests tiles on the current screen (unless noRedraw was set to true). |
+
Used to create Canvas-based tile layers where tiles get drawn on the browser side. Extends TileLayer, implements ILayer interface.
+Used to create Canvas-based tile layers where tiles get drawn on the browser side. Extends TileLayer.
drawTile( <HTMLCanvasElement> canvas , <Point> tilePoint , <Number> zoom ) thisthiscanvas is the actual canvas tile on which you can draw, tilePoint represents the tile numbers, and zoom is the current zoom.L.ImageOverlay( <String> imageUrl , <LatLngBounds> bounds ) L.ImageOverlay( <String> imageUrl , <LatLngBounds> bounds , <ImageOverlay options> options? ) new L.ImageOverlay(…)L.imageOverlay(…)
@@ -1459,7 +1528,40 @@ L.imageOverlay(imageUrl, imageBounds).addTo(map);
| Option | +Type | +Default | +Description | +
|---|---|---|---|
opacity |
+ Number |
+ 1.0 |
+ The opacity of the image overlay. | +
| Method | +Returns | +Description | +
|---|---|---|
addTo( |
+ this |
+ Adds the overlay to the map. | +
setOpacity( |
+ this |
+ Sets the opacity of the overlay. | +
strokeBooleantruefalse to disable borders on polygons or circles.false to disable borders on polygons or circles.colorfillBooleanfalse to disable filling on polygons or circles.false to disable filling on polygons or circles.fillColorclickableBooleantruefalse, the vector will not emit mouse events and will act as a part of the underlying map.false, the vector will not emit mouse events and will act as a part of the underlying map.MouseEvent
contextmenuMouseEvent
+ CANVASBooleanL_PREFER_CANVAS to true before the Leaflet include on your page — sometimes it can increase performance dramatically when rendering thousands of circle markers, but currently suffers from a bug that causes removing such layers to be extremely slow.L_PREFER_CANVAS to true before the Leaflet include on your page — sometimes it can increase performance dramatically when rendering thousands of circle markers, but currently suffers from a bug that causes removing such layers to be extremely slow.CLIP_PADDINGaddTo( <Map> map ) thisbindPopup( <String> htmlContent , <Popup options> options? ) thisthisopenPopup( <LatLng> latlng? ) thissetStyle( <Path options> object ) thisthisaddLatLng( <LatLng> latlng ) thisthissetLatLngs( <LatLng[]> latlngs ) thisthisLatLng[]getBounds()LatLngBoundssetBounds( <LatLngBounds> bounds ) thisthissetLatLng( <LatLng> latlng ) thisthissetRadius( <Number> radius ) thisthissetLatLng( <LatLng> latlng ) thisthissetRadius( <Number> radius ) thisthisaddTo( <Map> map ) thisaddLayer( <ILayer> layer ) thisthisremoveLayer( <ILayer> layer ) thisthisclearLayers()thisthisbindPopup( <String> htmlContent , <Popup options> options? )thisthisbindPopup method.getBounds()LatLngBoundscoordsToLatlng( <Array> coords , <Boolean> reverse? ) LatLngreverse is set to true, the numbers will be interpreted as (longitude, latitude).reverse is set to true, the numbers will be interpreted as (longitude, latitude).coordsToLatlngs( <Array> coords , <Number> levelsDeep? , <Boolean> reverse? ) ArraylevelsDeep specifies the nesting level (0 is for an array of points, 1 for an array of arrays of points, etc., 0 by default). If reverse is set to true, the numbers will be interpreted as (longitude, latitude).levelsDeep specifies the nesting level (0 is for an array of points, 1 for an array of arrays of points, etc., 0 by default). If reverse is set to true, the numbers will be interpreted as (longitude, latitude).equals( <LatLng> otherLatlng ) Booleantrue if the given LatLng point is at the same position (within a small margin of error).true if the given LatLng point is at the same position (within a small margin of error).toString()extend( <LatLng|LatLngBounds> latlng ) thisthiscontains( <LatLngBounds> otherBounds ) Booleantrue if the rectangle contains the given one.true if the rectangle contains the given one.contains( <LatLng> latlng ) Booleantrue if the rectangle contains the given point.true if the rectangle contains the given point.intersects( <LatLngBounds> otherBounds ) Booleantrue if the rectangle intersects the given bounds.true if the rectangle intersects the given bounds.equals( <LatLngBounds> otherBounds ) Booleantrue if the rectangle is equivalent (within a small margin of error) to the given bounds.true if the rectangle is equivalent (within a small margin of error) to the given bounds.toBBoxString()String'southwest_lng,southwest_lat,northeast_lng,northeast_lat' format. Useful for sending requests to web services that return geo data.pad( <Number> bufferRatio ) LatLngBoundsL.point(…)L.point([…])
- x and y coordinates. If optional round is set to true, rounds the x and y values.x and y coordinates. If optional round is set to true, rounds the x and y values.divideBy( <Number> number , <Boolean> round? ) Pointround is set to true, returns a rounded result.round is set to true, returns a rounded result.distanceTo( <Point> otherPoint ) contains( <Bounds> otherBounds ) Booleantrue if the rectangle contains the given one.true if the rectangle contains the given one.contains( <Point> point ) Booleantrue if the rectangle contains the given point.true if the rectangle contains the given point.intersects( <Bounds> otherBounds ) Booleantrue if the rectangle intersects the given bounds.true if the rectangle intersects the given bounds.shadowUrlString
- shadowUrl is null then no shadow image will be created.shadowUrl is null then no shadow image will be created.shadowSizeA basic zoom control with two buttons (zoom in and zoom out). It is put on the map by default unless you set its zoomControl option to false. Implements IControl interface.
The base class for all Leaflet controls. Implements IControl interface. You can add controls to the map like this:
+ +control.addTo(map);
+// the same as
+map.addControl(control);| Constructor | +Constructor | +Usage | Description |
|---|---|---|---|
L.Control.Zoom() |
+ L.Control( |
+
+ new L.Control(…)+ L.control(…)
+ |
+ Creates a control with the given options. | +
| Option | +Type | +Default | +Description | +
|---|---|---|---|
position |
+ String |
+ 'topright' |
+ The initial position of the control (one of the map corners). See control positions. | +
| Method | +Returns | +Description | +
|---|---|---|
setPosition( |
+ this |
+ Sets the position of the control. See control positions. | +
getPosition() |
+ String |
+ Returns the current position of the control. | +
addTo( |
+ this |
+ Adds the control to the map. | +
removeFrom( |
+ this |
+ Removes the control from the map. | +
Control positions (map corner to put a control to) are set using strings. Margins between controls and the map border are set with CSS, so that you can easily override them.
+ +| Position | +Description | +
|---|---|
'topleft' |
+ Top left of the map. | +
'topright' |
+ Top right of the map. | +
'bottomleft' |
+ Bottom left of the map. | +
'bottomright' |
+ Bottom right of the map. | +
A basic zoom control with two buttons (zoom in and zoom out). It is put on the map by default unless you set its zoomControl option to false. Extends Control.
| Constructor | +Usage | +Description | +
|---|---|---|
L.Control.Zoom( |
+
+ new L.Control.Zoom(…)+ L.control.zoom(…)
+ |
Creates a zoom control. |
| Option | +Type | +Default | +Description | +
|---|---|---|---|
position |
+ String |
+ 'topleft' |
+ The position of the control (one of the map corners). See control positions. | +
The attribution control allows you to display attribution data in a small text box on a map. It is put on the map by default unless you set its attributionControl option to false, and it fetches attribution texts from layers with getAttribution method automatically. Implements IControl interface.
The attribution control allows you to display attribution data in a small text box on a map. It is put on the map by default unless you set its attributionControl option to false, and it fetches attribution texts from layers with getAttribution method automatically. Extends Control.
| Constructor | +Usage | Description | |
|---|---|---|---|
L.Control.Attribution() |
+ L.Control.Attribution( |
+
+ new L.Control.Attribution(…)+ L.control.attribution(…)
+ |
Creates an attribution control. |
| Option | +Type | +Default | +Description | +
|---|---|---|---|
position |
+ String |
+ 'bottomright' |
+ The position of the control (one of the map corners). See control positions. | +
prefix |
+ String |
+ 'Powered by Leaflet' |
+ The HTML text shown before the attributions. Pass false to disable. |
+
setPrefix( |
- - | -Sets the string before the attributions ("Powered by Leaflet" by default). | +this |
+ Sets the text before the attributions. |
addAttribution( |
- - | -Adds an attribution text (e.g. "Vector data © CloudMade"). | +this |
+ Adds an attribution text (e.g. 'Vector data © CloudMade'). |
removeAttribution( |
- - | +this |
Removes an attribution text. |
The layers control gives users the ability to switch between different base layers and switch overlays on/off (check out the detailed example). It should be created and added explicitly to the map using Map#addControl method. Implements IControl interface.
+The layers control gives users the ability to switch between different base layers and switch overlays on/off (check out the detailed example). Extends Control.
var baseLayers = {
"CloudMade": cloudmade,
@@ -2737,18 +3010,21 @@ var overlays = {
"Roads": roadsLayer
};
-layersControl = new L.Control.Layers(baseLayers, overlays);
-
-map.addControl(layersControl);| Constructor | +Usage | Description |
|---|---|---|
L.Control.Layers( |
+
+ new L.Control.Layers(…)+ L.control.layers(…)
+ |
Creates an attribution control with the given layers. Base layers will be switched with radio buttons, while overlays will be switched with checkboxes. |
addBaseLayer( <ILayer> layer , <String> name ) thisthisaddOverlay( <ILayer> layer , <String> name ) thisthisremoveLayer( <ILayer> layer ) thisthispositionString'topright'collapsedBooleantruetrue, the control will be collapsed into an icon and expanded on mouse hover or touch.true, the control will be collapsed into an icon and expanded on mouse hover or touch.A simple scale control that shows the scale of the current center of screen in metric (m/km) and imerial (mi/ft) systems. Implements IControl interface.
+ +L.control.scale().addTo(map);| Constructor | +Usage | +Description | +
|---|---|---|
L.Control.Scale( |
+
+ new L.Control.Attribution(…)+ L.control.attribution(…)
+ |
+ Creates an scale control with the given options. | +
| Option | +Type | +Default | +Description | +
|---|---|---|---|
position |
+ String |
+ 'bottomleft' |
+ The position of the control (one of the map corners). See control positions. | +
maxWidth |
+ Number |
+ 100 |
+ Maximum width of the control in pixels. The width is set dynamically to show round values (e.g. 100, 200, 500). | +
metric |
+ Boolean |
+ true |
+ Whether to show the metric scale line (m/km). | +
imerial |
+ Boolean |
+ true |
+ Whether to show the imerial scale line (mi/ft). | +
updateWhenIdle |
+ Boolean |
+ false |
+ If true, the control is updated on moveend, otherwise it's always up-to-date (updated on move). |
+
A set of methods shared between event-powered classes (like Map). Generally, events allow you to execute some function when something happens with an object (e.g. the user clicks on the map, causing the map 'fire' event).
addEventListener( <String> type , <Function> fn , <Object> context? ) thisfn) to a particular event type of the object. You can optionally specify the context of the listener (object the this keyword will point to).thisfn) to a particular event type of the object. You can optionally specify the context of the listener (object the this keyword will point to).removeEventListener( <String> type , <Function> fn , <Object> context? ) thisthison( … )thisthisaddEventListener.off( … )thisthisremoveEventListener.hasEventListeners( <String> type ) Booleantrue if a particular event type has some listeners attached to it.true if a particular event type has some listeners attached to it.fireEvent( <String> type , <Object> data? ) thisthisfire( … )thisthisfireEvent.PointcontainerPointPointoriginalEventDOMMouseEventieBooleantrue for all Internet Explorer versions.true for all Internet Explorer versions.ie6Booleantrue for Internet Explorer 6.true for Internet Explorer 6.webkitBooleantrue for webkit-based browsers like Chrome and Safari (including mobile versions).true for webkit-based browsers like Chrome and Safari (including mobile versions).webkit3dBooleantrue for webkit-based browsers that support CSS 3D transformations.true for webkit-based browsers that support CSS 3D transformations.geckoBooleantrue for Gecko-based browsers like Firefox and Mozilla.true for Gecko-based browsers like Firefox and Mozilla.operaBooleantrue for Opera.true for Opera.androidBooleantrue for Android mobile browser.true for Android mobile browser.mobileBooleantrue for modern mobile browsers (including iOS Safari and different Android browsers).true for modern mobile browsers (including iOS Safari and different Android browsers).mobileWebkitBooleantrue for mobile webkit-based browsers.true for mobile webkit-based browsers.mobileOperaBooleantrue for mobile Opera.true for mobile Opera.touchBooleantrue for all browsers on touch devices.true for all browsers on touch devices.bind( <Function> fn , <Object> obj ) Functionfn with the given scope obj (so that this keyword refers to obj inside the function code).fn with the given scope obj (so that this keyword refers to obj inside the function code).stamp( <Object> obj )falseFn()Functionfalse.false.formatNum( <Number> num , <Number> digits ) hasClass( <HTMLElement> el , <String> name ) Booleantrue if the element class attribute contains name.true if the element class attribute contains name.addClass( <HTMLElement> el , <String> name ) testProp( <String[]> props ) String or falsefalse. Useful for vendor-prefixed styles like transform.false. Useful for vendor-prefixed styles like transform.getTranslateString( <Point> point ) setPosition( <HTMLElement> el , <Point> point , <Boolean> disable3D? ) point, using CSS translate or top/left positioning depending on the browser (used by Leaflet internally to position its layers). Forces top/left positioning if disable3D is true.point, using CSS translate or top/left positioning depending on the browser (used by Leaflet internally to position its layers). Forces top/left positioning if disable3D is true.getPosition( <HTMLElement> el ) enabled()Booleantrue if the handler is enabled.true if the handler is enabled.