setStyle(
<Path options> object )
@@ -2700,7 +2646,7 @@ var latlngs = [
Methods
-You can use Path methods and additionally the following methods:
+In addition to Path methods like redraw() and bringToFront(), shared layer methods like addTo() and remove() and popup methods like bindPopup() you can also use the following methods:
@@ -2815,7 +2761,7 @@ var latlngs = [
Methods
-Polygon has the same options and methods as Polyline, with the following differences:
+In addition to Path methods like redraw() and bringToFront(), Polyline mehtods like setLatLngs() and getLatLngs(), shared layer methods like addTo() and remove() and popup methods like bindPopup() you can also use the following methods:
@@ -2867,7 +2813,7 @@ map.fitBounds(bounds);
Methods
-You can use Path methods and additionally the following methods:
+In addition to Path methods like redraw() and bringToFront(), shared layer methods like addTo() and remove() and popup methods like bindPopup() you can also use the following methods:
@@ -2914,6 +2860,8 @@ map.fitBounds(bounds);
Methods
+In addition to Path methods like redraw() and bringToFront(), shared layer methods like addTo() and remove() and popup methods like bindPopup() you can also use the following methods:
+
| Method |
@@ -2980,6 +2928,8 @@ map.fitBounds(bounds);
Methods
+In addition to Path methods like redraw() and bringToFront(), shared layer methods like addTo() and remove() and popup methods like bindPopup() you can also use the following methods:
+
| Method |
@@ -3153,8 +3103,6 @@ map.fitBounds(bounds);
Methods
-Has all layerGroup methods and additionally:
-
| Method |
@@ -3400,8 +3348,216 @@ map.fitBounds(bounds);
+GridLayer
+Generic class for handling a tiled grid of HTML elements. This is the base class for all tile layers and replaces TileLayer.Canvas.
+GridLayer can be extended to create a tiled grid of HTML Elements like <canvas>, <img> or <div>.GridLayer will handle creating and animating these DOM elements for you.
+
+Synchronous usage example
+
+To create a custom layer, extend GridLayer and impliment the createTile() method, which will be passed a Point object with the x, y, and z (zoom level) coordinates to draw your tile.
+
+var CanvasLayer = L.GridLayer.extend({
+ createTile: function(coords){
+ // create a <canvas> element for drawing
+ var tile = L.DomUtil.create('canvas', 'leaflet-tile');
+
+ // setup tile width and height according to the options
+ tile.width = tile.height = this.options.tileSize;
+
+ // get a canvas context and draw something on it using coords.x, coords.y and coords.z
+ var ctx = canvas.getContext('2d');
+
+ // return the tile so it can be rendered on screen
+ return tile;
+ }
+});
+
+Asyncronous usage example
+
+Tile creation can also be asyncronous, this is useful when using a third-party drawing library. Once the tile is finsihed drawing it can be passed to the done() callback.
+
+var CanvasLayer = L.GridLayer.extend({
+ createTile: function(coords, done){
+ var error;
+
+ // create a <canvas> element for drawing
+ var tile = L.DomUtil.create('canvas', 'leaflet-tile');
+
+ // setup tile width and height according to the options
+ tile.width = tile.height = this.options.tileSize;
+
+ // draw something and pass the tile to the done() callback
+ done(error, tile);
+ }
+});
+
+Constructor
+
+
+
+ | Factory |
+ Description |
+
+
+ L.gridLayer(<GridLayer options> options?) |
+ Creates a new instance of GridLayer with the supplied options. |
+
+
+
+Options
+
+
+
+ | Option |
+ Type |
+ Default value |
+ Description |
+
+
+ maxZoom |
+ Number |
+ 'tilePane' |
+ The map pane the layer will be added to. |
+
+
+ tileSize |
+ Number |
+ 256 |
+ Width and height of tiles in the grid. Can be used in the createTile() function. |
+
+
+ opacity |
+ Number |
+ 1 |
+ Opacity of the tiles. Can be used in the createTile() function. |
+
+
+ unloadInvisibleTiles |
+ Boolean |
+ depends |
+ If true, all the tiles that are not visible after panning are removed (for better performance). true by default on mobile WebKit, otherwise false. |
+
+
+ updateWhenIdle |
+ Boolean |
+ depends |
+ If false, new tiles are loaded during panning, otherwise only after it (for better performance). true by default on mobile WebKit, otherwise false. |
+
+
+ updateInterval |
+ Number |
+ 200 |
+ Tiles will not update more then once every updateInterval. |
+
+
+ zIndex |
+ Number |
+ null |
+ The explicit zIndex of the tile layer. Not set by default. |
+
+
+ bounds |
+ LatLngBounds |
+ null |
+ If set tiles will only be loaded inside inside the set LatLngBounds. |
+
+
+ bounds |
+ LatLngBounds |
+ null |
+ If set tiles will only be loaded inside inside the set LatLngBounds. |
+
+
+ minZoom |
+ Number |
+ 0 |
+ The minimum zoom level that tiles will be loaded at. By default the entire map. |
+
+
+
+Methods
+
+
+
+ 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. |
+
+
+ setOpacity(
+ <Number> opacity )
+ |
+
+ this |
+ Changes the opacity of the tile layer. |
+
+
+ setZIndex(
+ <Number> zIndex )
+ |
+
+ this |
+ Sets the zIndex of the tile layer. |
+
+
+ redraw() |
+ this |
+ Causes the layer to clear all the tiles and request them again. |
+
+
+ getContainer()
+ |
+ HTMLElement |
+ Returns the HTML element that contains the tiles for this layer. |
+
+
+
+Events
+
+
+
+ | Event |
+ Data |
+ Description |
+
+
+ loading |
+ Event |
+ Fired when the tile layer starts loading tiles. |
+
+
+ load |
+ Event |
+ Fired when the tile layer loaded all visible tiles. |
+
+
+ tileloadstart |
+ TileEvent |
+ Fired when a tile is requested and starts loading. |
+
+
+ tileload |
+ TileEvent |
+ Fired when a tile loads. |
+
+
+ tileunload |
+ TileEvent |
+ Fired when a tile is removed (e.g. when you have unloadInvisibleTiles on). |
+
+
+ tileerror |
+ TileEvent |
+ Fired when there is an error loading a tile. |
+
+
LatLng
@@ -4447,10 +4603,9 @@ L.control.layers(baseLayers, overlays).addTo(map);
-
Events methods
-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 'click' event).
+A set of methods shared between event-powered classes (like Map and Marker). 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 to fire 'click' event).
Example
@@ -4572,269 +4727,99 @@ map.off('click', onClick);
-Event objects
+Layer methods
-Event object is an object that you receive as an argument in a listener function when some event is fired, containing useful information about that event. For example:
+A set of methods inherited from the Layer base class that all Leaflet layers use.
-map.on('click', function(e) {
- alert(e.latlng); // e is an event object (MouseEvent in this case)
-});
+var layer = L.Marker(latlng).addTo(map);
+layer.addTo(map);
+layer.remove();
-Event
+Methods
-The base event object. All other event objects contain these properties too.
-
-
+
- | property |
- type |
- description |
+ Method |
+ Returns |
+ Description |
- type |
- String |
- The event type (e.g. 'click'). |
+ addTo(<Map> map) |
+ this |
+ Adds the layer to the given map. |
- target |
- Object |
- The object that fired the event. |
-
-
-
-MouseEvent
-
-
-
- | property |
- type |
- description |
+ removeFrom(<Map> map) |
+ this |
+ Removes the layer to the given map. |
- latlng |
- LatLng |
- The geographical point where the mouse event occured. |
+ remove() |
+ this |
+ Removes the layer from the map it is currently active on. |
- layerPoint |
- Point |
- Pixel coordinates of the point where the mouse event occured relative to the map layer. |
-
-
- containerPoint |
- Point |
- Pixel coordinates of the point where the mouse event occured relative to the map сontainer. |
-
-
- originalEvent |
- DOMMouseEvent |
- The original DOM mouse event fired by the browser. |
-
-
-
-LocationEvent
-
-
-
- | property |
- type |
- description |
-
-
- latlng |
- LatLng |
- Detected geographical location of the user. |
-
-
- bounds |
- LatLngBounds |
- Geographical bounds of the area user is located in (with respect to the accuracy of location). |
-
-
- accuracy |
- Number |
- Accuracy of location in meters. |
-
-
- altitude |
- Number |
- Height of the position above the WGS84 ellipsoid in meters. |
-
-
- altitudeAccuracy |
- Number |
- Accuracy of altitude in meters. |
-
-
- heading |
- Number |
- The direction of travel in degrees counting clockwise from true North. |
-
-
- speed |
- Number |
- Current velocity in meters per second. |
-
-
- timestamp |
- Number |
- The time when the position was acquired. |
-
-
-
-ErrorEvent
-
-
-
- | property |
- type |
- description |
-
-
- message |
- String |
- Error message. |
-
-
- code |
- Number |
- Error code (if applicable). |
-
-
-
-LayerEvent
-
-
-
- | property |
- type |
- description |
-
-
- layer |
- ILayer |
- The layer that was added or removed. |
-
-
-
-LayersControlEvent
-
-
-
- | property |
- type |
- description |
-
-
- layer |
- ILayer |
- The layer that was added or removed. |
-
-
- name |
- String |
- The name of the layer that was added or removed. |
-
-
-
-TileEvent
-
-
-
- | property |
- type |
- description |
-
-
- tile |
+ getPane(<String> name?) |
HTMLElement |
- The tile element (image). |
+ Returns the HTMLElement representing the named pane on the map. Or if name is omitted the pane for this layer. |
-ResizeEvent
+
-
-
- | property |
- type |
- description |
-
-
- oldSize |
- Point |
- The old size before resize event. |
-
-
- newSize |
- Point |
- The new size after the resize event. |
-
-
+A set of methods inherited from the Layer base class that all Leaflet layers use. These methods provide convieniant ways of binding popups to any layer.
-GeoJSON event
+var layer = L.Polgon(latlngs).bindPopup('Hi There!').addTo(map);
+layer.openPopup();
+layer.closePopup();
+
-
-
- | property |
- type |
- description |
-
-
- layer |
- ILayer |
- The layer for the GeoJSON feature that is being added to the map. |
-
-
- properties |
- Object |
- GeoJSON properties of the feature. |
-
-
- geometryType |
- String |
- GeoJSON geometry type of the feature. |
-
-
- id |
- String |
- GeoJSON ID of the feature (if present). |
-
-
+Popups will also be automatically opened when the layer is clicked on and closed when the layer is removed from the map or another popup is opened.
-
-
-
+Methods
+
- | property |
- type |
- description |
+ Method |
+ Returns |
+ Description |
- popup |
+ bindPopup(<String|HTMLElement|Popup> content, <PopupOptions> options?) |
+ this |
+ Binds the passed content to the layer and sets up the neccessary event listeners. |
+
+
+ unbindPopup() |
+ this |
+ Removes the popup previously bound with bindPopup. |
+
+
+ openPopup(LatLng latlng?) |
+ this |
+ Opens the bound popup at the specificed latlng or at the default popup anchor if no latlng is passed. |
+
+
+ closePopup() |
+ this |
+ Closes the popup if it is open. |
+
+
+ togglePopup() |
+ this |
+ Opens or closes the popup depending on its current state. |
+
+
+ setPopupContent(<String|HTMLElement|Popup> content, <PopupOptions> options?) |
+ this |
+ Sets the content of the popup. |
+
+
+ getPopup() |
Popup |
- The popup that was opened or closed. |
+ Returns the popup bound to this layer. |
-DragEndEvent
-
-
-
- | property |
- type |
- description |
-
-
- distance |
- Number |
- The distance in pixels the draggable element was moved by. |
-
-
-
-
-
-
Browser
A namespace with properties for browser/feature detection used by Leaflet internally.
@@ -4953,10 +4938,8 @@ map.off('click', onClick);
<Function> fn,
<Object> obj )
-
Function |
-
- Returns a function which executes function fn with the given scope obj (so that this keyword refers to obj inside the function code). Has an L.bind shortcut. Not a polyfill for ES 5 bind (compare L.bind to the MDN-recommended polyfill for Function.prototype.bind). |
+ Returns a function which executes function fn with the given scope obj (so that this keyword refers to obj inside the function code). Has an L.bind shortcut. |
stamp( <Object> obj ) |
@@ -4994,7 +4977,7 @@ map.off('click', onClick);
falseFn() |
Function |
- Always returns false. |
+ Returns a function which always returns false. |
formatNum(
@@ -5315,6 +5298,7 @@ map.off('click', onClick);
Utility functions to work with the DOM tree, used by Leaflet internally.
+>>>>>>> more layer docs
Methods
@@ -5368,9 +5352,13 @@ map.off('click', onClick);
Boolean |
-
Returns true if the element class attribute contains name. |
+
+ falseFn() |
+ Function |
+ Always returns false. |
+
addClass(
<HTMLElement> el,
@@ -6343,6 +6331,280 @@ map.addControl(new MyControl());
If you want to use some obscure CRS not listed here, take a look at the Proj4Leaflet plugin.
+Event objects
+
+Event object is an object that you recieve as an argument in a listener function when some event is fired, containing useful information about that event. For example:
+
+map.on('click', function(e) {
+ alert(e.latlng); // e is an event object (MouseEvent in this case)
+});
+
+Event
+
+The base event object. All other event objects contain these properties too.
+
+
+
+ | property |
+ type |
+ description |
+
+
+ type |
+ String |
+ The event type (e.g. 'click'). |
+
+
+ target |
+ Object |
+ The object that fired the event. |
+
+
+
+MouseEvent
+
+
+
+ | property |
+ type |
+ description |
+
+
+ latlng |
+ LatLng |
+ The geographical point where the mouse event occured. |
+
+
+ layerPoint |
+ Point |
+ Pixel coordinates of the point where the mouse event occured relative to the map layer. |
+
+
+ containerPoint |
+ Point |
+ Pixel coordinates of the point where the mouse event occured relative to the map сontainer. |
+
+
+ originalEvent |
+ DOMMouseEvent |
+ The original DOM mouse event fired by the browser. |
+
+
+
+LocationEvent
+
+
+
+ | property |
+ type |
+ description |
+
+
+ latlng |
+ LatLng |
+ Detected geographical location of the user. |
+
+
+ bounds |
+ LatLngBounds |
+ Geographical bounds of the area user is located in (with respect to the accuracy of location). |
+
+
+ accuracy |
+ Number |
+ Accuracy of location in meters. |
+
+
+ altitude |
+ Number |
+ Height of the position above the WGS84 ellipsoid in meters. |
+
+
+ altitudeAccuracy |
+ Number |
+ Accuracy of altitude in meters. |
+
+
+ heading |
+ Number |
+ The direction of travel in degrees counting clockwise from true North. |
+
+
+ speed |
+ Number |
+ Current velocity in meters per second. |
+
+
+ timestamp |
+ Number |
+ The time when the position was acquired. |
+
+
+
+ErrorEvent
+
+
+
+ | property |
+ type |
+ description |
+
+
+ message |
+ String |
+ Error message. |
+
+
+ code |
+ Number |
+ Error code (if applicable). |
+
+
+
+LayerEvent
+
+
+
+ | property |
+ type |
+ description |
+
+
+ layer |
+ ILayer |
+ The layer that was added or removed. |
+
+
+
+LayersControlEvent
+
+
+
+ | property |
+ type |
+ description |
+
+
+ layer |
+ ILayer |
+ The layer that was added or removed. |
+
+
+ name |
+ String |
+ The name of the layer that was added or removed. |
+
+
+
+TileEvent
+
+
+
+ | property |
+ type |
+ description |
+
+
+ tile |
+ HTMLElement |
+ The tile element (image). |
+
+
+
+TileErrorEvent
+
+
+
+ | property |
+ type |
+ description |
+
+
+ tile |
+ HTMLElement |
+ The tile element (image). |
+
+
+
+ResizeEvent
+
+
+
+ | property |
+ type |
+ description |
+
+
+ oldSize |
+ Point |
+ The old size before resize event. |
+
+
+ newSize |
+ Point |
+ The new size after the resize event. |
+
+
+
+GeoJSON event
+
+
+
+ | property |
+ type |
+ description |
+
+
+ layer |
+ ILayer |
+ The layer for the GeoJSON feature that is being added to the map. |
+
+
+ properties |
+ Object |
+ GeoJSON properties of the feature. |
+
+
+ geometryType |
+ String |
+ GeoJSON geometry type of the feature. |
+
+
+ id |
+ String |
+ GeoJSON ID of the feature (if present). |
+
+
+
+
+
+
+
+ | property |
+ type |
+ description |
+
+
+ popup |
+ Popup |
+ The popup that was opened or closed. |
+
+
+
+DragEndEvent
+
+
+
+ | property |
+ type |
+ description |
+
+
+ distance |
+ Number |
+ The distance in pixels the draggable element was moved by. |
+
+
Global Switches
| | |