cartodb/Leaflet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

merge gh-pages

Browse Source
This commit is contained in:
Vladimir Agafonkin 2013-01-16 17:17:03 +02:00
commit 664491d4be
11 changed files with 227 additions and 87 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
_layouts/default.html
View File

@ -8,7 +8,7 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta property="og:title" content="Leaflet — an open-source JavaScript library for interactive maps" /> <meta property="og:title" content="Leaflet — an open-source JavaScript library for interactive maps" />
<meta property="og:description" content="Leaflet is a modern, lightweight BSD-licensed JavaScript library for making tile-based interactive maps for both desktop and mobile web browsers, developed by CloudMade to form the core of its next generation JavaScript API." /> <meta property="og:description" content="Leaflet is a modern, lightweight open-source JavaScript library for mobile-friendly interactive maps." />
<meta property="og:image" content="http://leafletjs.com/docs/images/logo.png" /> <meta property="og:image" content="http://leafletjs.com/docs/images/logo.png" />
<meta itemprop="name" content="Leaflet"> <meta itemprop="name" content="Leaflet">
@ -46,19 +46,22 @@
'Imagery © <a href="http://cloudmade.com">CloudMade</a>'; 'Imagery © <a href="http://cloudmade.com">CloudMade</a>';
CM_URL = 'http://{s}.tile.cloudmade.com/BC9A493B41014CAABB98F0471D759707/{styleId}/256/{z}/{x}/{y}.png'; CM_URL = 'http://{s}.tile.cloudmade.com/BC9A493B41014CAABB98F0471D759707/{styleId}/256/{z}/{x}/{y}.png';
OSM_URL = 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';
OSM_ATTRIB = '&copy; <a href="http://openstreetmap.org/copyright">OpenStreetMap</a> contributors';
</script> </script>
</head> </head>
<body{% if page.bodyclass %} class="{{ page.bodyclass }}"{% endif %}> <body{% if page.bodyclass %} class="{{ page.bodyclass }}"{% endif %}>
<div class="container"> <div class="container">
<h1><a href="http://leafletjs.com">Leaflet</a></h1> <h1><a href="http://leafletjs.com">Leaflet</a></h1>
<h3 class="alt">An Open-Source JavaScript Library for Mobile-Friendly Interactive Maps by <a href="http://cloudmade.com">CloudMade</a></h3> <h3 class="alt">An Open-Source JavaScript Library for Mobile-Friendly Interactive Maps<!-- by <a href="http://cloudmade.com">CloudMade</a>--></h3>
<div class="social-buttons"> <div class="social-buttons">
<iframe src="http://ghbtns.com/github-btn.html?user=CloudMade&amp;repo=Leaflet&amp;type=watch&amp;count=true" allowtransparency="true" frameborder="0" scrolling="0" width="104px" height="20px"></iframe> <iframe src="http://ghbtns.com/github-btn.html?user=Leaflet&amp;repo=Leaflet&amp;type=watch&amp;count=true" allowtransparency="true" frameborder="0" scrolling="0" width="104px" height="20px"></iframe>
<iframe src="http://ghbtns.com/github-btn.html?user=CloudMade&amp;repo=Leaflet&amp;type=fork&amp;count=true" allowtransparency="true" frameborder="0" scrolling="0" width="98px" height="20px"></iframe> <!--<iframe src="http://ghbtns.com/github-btn.html?user=Leaflet&amp;repo=Leaflet&amp;type=fork&amp;count=true" allowtransparency="true" frameborder="0" scrolling="0" width="98px" height="20px"></iframe>-->
<a href="http://twitter.com/share" class="twitter-share-button" data-url="http://leafletjs.com" data-text="Leaflet — an open-source JavaScript library for mobile-friendly interactive maps by @cloudmade" data-via="LeafletJS" data-related="CloudMade" data-count="none">Tweet</a> <a href="http://twitter.com/share" class="twitter-share-button" data-url="http://leafletjs.com" data-text="Leaflet — an open-source JavaScript library for mobile-friendly interactive maps" data-via="LeafletJS" data-related="CloudMade" data-count="none">Tweet</a>
<a href="https://twitter.com/LeafletJS" class="twitter-follow-button" data-show-count="true" data-show-screen-name="false">Follow @LeafletJS</a> <a href="https://twitter.com/LeafletJS" class="twitter-follow-button" data-show-count="true" data-show-screen-name="false">Follow @LeafletJS</a>
@ -130,18 +133,18 @@
</li> </li>
<li><a class="forum-link" href="https://groups.google.com/forum/#!forum/leaflet-js">Forum</a></li> <li><a class="forum-link" href="https://groups.google.com/forum/#!forum/leaflet-js">Forum</a></li>
<li><a class="twitter-link" href="http://twitter.com/LeafletJS">Twitter</a></li> <li><a class="twitter-link" href="http://twitter.com/LeafletJS">Twitter</a></li>
<li><a class="github-link" href="http://github.com/CloudMade/Leaflet">GitHub</a></li> <li><a class="github-link" href="http://github.com/Leaflet/Leaflet">GitHub</a></li>
</ul> </ul>
{{ content }} {{ content }}
<div class="footer"> <div class="footer">
<hr /> <hr />
<p class="quiet">&copy; 2011&ndash;2012 <a href="http://cloudmade.com">CloudMade</a>, <a href="http://agafonkin.com/en">Vladimir Agafonkin</a>. Map data &copy; 2012 <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>.</p> <p class="quiet">&copy; 2010&ndash;2013 <a href="http://agafonkin.com/en">Vladimir Agafonkin</a>, 2010&ndash;2011 <a href="http://cloudmade.com">CloudMade</a>. Maps &copy; <a href="http://openstreetmap.org/copyright">OpenStreetMap</a> contributors.</p>
</div> </div>
</div> </div>
<a href="http://github.com/CloudMade/Leaflet"><img id="forkme" src="http://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png" alt="Fork me on GitHub" /></a> <a href="http://github.com/Leaflet/Leaflet"><img id="forkme" src="http://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png" alt="Fork me on GitHub" /></a>
<script> <script>
hljs.tabReplace = ' '; hljs.tabReplace = ' ';

8
_posts/2012-07-30-leaflet-0-4-released.md
View File

@ -6,7 +6,7 @@ author: Vladimir Agafonkin
authorsite: http://agafonkin.com/en authorsite: http://agafonkin.com/en
--- ---
After 5.5 months of development with [33 contributors](https://github.com/CloudMade/Leaflet/graphs/contributors?from=2012-02-15&to=2012-07-30&type=c) involved since the previous stable release, I'm proud to announce the release of Leaflet 0.4! It comes with a simpler API and *lots* of great improvements and important bugfixes, along with a major update to documentation, an official plugins page and the launch of this developer blog. Lets take a look at the improvements one by one. After 5.5 months of development with [33 contributors](https://github.com/Leaflet/Leaflet/graphs/contributors?from=2012-02-15&to=2012-07-30&type=c) involved since the previous stable release, I'm proud to announce the release of Leaflet 0.4! It comes with a simpler API and *lots* of great improvements and important bugfixes, along with a major update to documentation, an official plugins page and the launch of this developer blog. Lets take a look at the improvements one by one.
### Simpler API ### Simpler API
@ -116,7 +116,7 @@ Moreover, now if you only specify an event type to the `off` method, it will rem
#### Other API Improvements #### Other API Improvements
Leaflet 0.4 features more than 30 new methods, options and events across different Leaflet classes that make the API more complete and powerful. Check out the [full changelog](https://github.com/CloudMade/Leaflet/blob/master/CHANGELOG.md#other-api-improvements) for the complete list. Leaflet 0.4 features more than 30 new methods, options and events across different Leaflet classes that make the API more complete and powerful. Check out the [full changelog](https://github.com/Leaflet/Leaflet/blob/master/CHANGELOG.md#other-api-improvements) for the complete list.
### Performance and Usability Improvements ### Performance and Usability Improvements
@ -137,11 +137,11 @@ In addition, there are several usability improvents not already mentioned:
Leaflet 0.4 brings around 45 bugfixes that make it more stable and reliable across all browsers and platforms. Notable bugfixes include the dreaded iOS bug that caused the map to completely disappear after pinch-zooming in some rare cases, broken zooming on IE10 beta, broken Leaflet maps on pages served with an XHTML content type, and incorrect zooming on maps inside a fixed-position element. Leaflet 0.4 brings around 45 bugfixes that make it more stable and reliable across all browsers and platforms. Notable bugfixes include the dreaded iOS bug that caused the map to completely disappear after pinch-zooming in some rare cases, broken zooming on IE10 beta, broken Leaflet maps on pages served with an XHTML content type, and incorrect zooming on maps inside a fixed-position element.
Here's [a full list of bugfixes](https://github.com/CloudMade/Leaflet/blob/master/CHANGELOG.md#bug-fixes) in the changelog. Here's [a full list of bugfixes](https://github.com/Leaflet/Leaflet/blob/master/CHANGELOG.md#bug-fixes) in the changelog.
### Upgrading from older versions ### Upgrading from older versions
Besides the GeoJSON and Icon changes mentioned above, here's a [list of potentially breaking changes](https://github.com/CloudMade/Leaflet/blob/master/CHANGELOG.md#other-breaking-api-changes) --- read it carefully when updating your code (shouldn't take much time though). Besides the GeoJSON and Icon changes mentioned above, here's a [list of potentially breaking changes](https://github.com/Leaflet/Leaflet/blob/master/CHANGELOG.md#other-breaking-api-changes) --- read it carefully when updating your code (shouldn't take much time though).
Download options for Leaflet 0.4 (including the actual download, the CDN-hosted version, and intructions for building manually) are listed on the [download page](../../../download.html). Download options for Leaflet 0.4 (including the actual download, the CDN-hosted version, and intructions for building manually) are listed on the [download page](../../../download.html).

18
_posts/2012-08-07-leaflet-0-4-3-and-a-new-tutorial.md
View File

@ -22,26 +22,26 @@ Grab the new Leaflet 0.4.3 at the [download page](../../../download.html). Enjoy
* Added `GeoJSON` `resetStyle(layer)`, useful for resetting hover state. * Added `GeoJSON` `resetStyle(layer)`, useful for resetting hover state.
* Added `feature` property to layers created with `GeoJSON` (containing the GeoJSON feature data). * Added `feature` property to layers created with `GeoJSON` (containing the GeoJSON feature data).
* Added `FeatureGroup` `bringToFront` and `bringToBack` methods (so that they would work for multipolys). * Added `FeatureGroup` `bringToFront` and `bringToBack` methods (so that they would work for multipolys).
* Added optional `animate` argument to `Map` `invalidateSize` (by [@ajbeaven](https://github.com/ajbeaven)). [#857](https://github.com/CloudMade/Leaflet/pull/857) * Added optional `animate` argument to `Map` `invalidateSize` (by [@ajbeaven](https://github.com/ajbeaven)). [#857](https://github.com/Leaflet/Leaflet/pull/857)
#### Bugfixes #### Bugfixes
* Fixed a bug where tiles sometimes disappeared on initial map load on Android 2/3 (by [@danzel](https://github.com/danzel)). [#868](https://github.com/CloudMade/Leaflet/pull/868) * Fixed a bug where tiles sometimes disappeared on initial map load on Android 2/3 (by [@danzel](https://github.com/danzel)). [#868](https://github.com/Leaflet/Leaflet/pull/868)
* Fixed a bug where map would occasionally flicker near the border on zoom or pan on Chrome. * Fixed a bug where map would occasionally flicker near the border on zoom or pan on Chrome.
* Fixed a bug where `Path` `bringToFront` and `bringToBack` didn't return `this`. * Fixed a bug where `Path` `bringToFront` and `bringToBack` didn't return `this`.
* Removed zoom out on Win/Meta key binding (since it interferes with global keyboard shortcuts). [#869](https://github.com/CloudMade/Leaflet/issues/869) * Removed zoom out on Win/Meta key binding (since it interferes with global keyboard shortcuts). [#869](https://github.com/Leaflet/Leaflet/issues/869)
### 0.4.2 (August 1, 2012) ### 0.4.2 (August 1, 2012)
* Fixed a bug where layers control radio buttons would not work correctly in IE7 (by [@danzel](https://github.com/danzel)). [#862](https://github.com/CloudMade/Leaflet/pull/862) * Fixed a bug where layers control radio buttons would not work correctly in IE7 (by [@danzel](https://github.com/danzel)). [#862](https://github.com/Leaflet/Leaflet/pull/862)
* Fixed a bug where `FeatureGroup` `removeLayer` would unbind popups of removed layers even if the popups were not put by the group (affected [Leaflet.markercluster](https://github.com/danzel/Leaflet.markercluster) plugin) (by [@danzel](https://github.com/danzel)). [#861](https://github.com/CloudMade/Leaflet/pull/861) * Fixed a bug where `FeatureGroup` `removeLayer` would unbind popups of removed layers even if the popups were not put by the group (affected [Leaflet.markercluster](https://github.com/danzel/Leaflet.markercluster) plugin) (by [@danzel](https://github.com/danzel)). [#861](https://github.com/Leaflet/Leaflet/pull/861)
### 0.4.1 (July 31, 2012) ### 0.4.1 (July 31, 2012)
* Fixed a bug that caused marker shadows appear as opaque black in IE6-8. [#850](https://github.com/CloudMade/Leaflet/issues/850) * Fixed a bug that caused marker shadows appear as opaque black in IE6-8. [#850](https://github.com/Leaflet/Leaflet/issues/850)
* Fixed a bug with incorrect calculation of scale by the scale control. [#852](https://github.com/CloudMade/Leaflet/issues/852) * Fixed a bug with incorrect calculation of scale by the scale control. [#852](https://github.com/Leaflet/Leaflet/issues/852)
* Fixed broken L.tileLayer.wms class factory (by [@mattcurrie](https://github.com/mattcurrie)). [#856](https://github.com/CloudMade/Leaflet/issues/856) * Fixed broken L.tileLayer.wms class factory (by [@mattcurrie](https://github.com/mattcurrie)). [#856](https://github.com/Leaflet/Leaflet/issues/856)
* Improved retina detection for `TileLayer` `detectRetina` option (by [@sxua](https://github.com/sxua)). [#854](https://github.com/CloudMade/Leaflet/issues/854) * Improved retina detection for `TileLayer` `detectRetina` option (by [@sxua](https://github.com/sxua)). [#854](https://github.com/Leaflet/Leaflet/issues/854)
Sincerely, <br /> Sincerely, <br />
Vladimir Agafonkin, Leaflet maintainer. Vladimir Agafonkin, Leaflet maintainer.

4
_posts/2012-10-25-leaflet-0-4-5-bugfix-release-and-plans-for-0.5.md
View File

@ -16,7 +16,7 @@ Everyone is encouraged to upgrade (before Chrome 23 turns stable). As always, yo
As Leaflet approaches feature-complete state and API stabilization, we naturally shift our focus from new features towards performance and usability improvements, better browser and device support, bugfixes and internal refactoring to make certain parts of Leaflet (like projections and vector rendering) easier to extend and customize for plugin developers and advanced users. As Leaflet approaches feature-complete state and API stabilization, we naturally shift our focus from new features towards performance and usability improvements, better browser and device support, bugfixes and internal refactoring to make certain parts of Leaflet (like projections and vector rendering) easier to extend and customize for plugin developers and advanced users.
Highlights of things already implemented in the `master` branch include touch interaction support for **IE10 touch devices and Metro apps** and a more smooth and responsive panning inertia. Follow the [full changelog](https://github.com/CloudMade/Leaflet/blob/master/CHANGELOG.md) for more details. Highlights of things already implemented in the `master` branch include touch interaction support for **IE10 touch devices and Metro apps** and a more smooth and responsive panning inertia. Follow the [full changelog](https://github.com/Leaflet/Leaflet/blob/master/CHANGELOG.md) for more details.
We're also in the process of a major refactoring of vector rendering code to allow much simpler extension of base functionality with custom shapes, additional rendering systems (like WebGL in addition to existing SVG/VML and Canvas renderers), easy switching between renderers, also making the code simpler and easier to understand. We're also in the process of a major refactoring of vector rendering code to allow much simpler extension of base functionality with custom shapes, additional rendering systems (like WebGL in addition to existing SVG/VML and Canvas renderers), easy switching between renderers, also making the code simpler and easier to understand.
@ -28,7 +28,7 @@ The current plan is to release 0.5 stable sometime in mid-November. Stay tuned!
### Contributing to Leaflet ### Contributing to Leaflet
Leaflet is a true open source project, so we're always happy to meet new contributors, accept patches and bugreports. To help others become involved with Leaflet development and make managing contributions easier, I've put up a [Contributing to Leaflet](https://github.com/CloudMade/Leaflet/blob/master/CONTRIBUTING.md) guide with best practices and advices &mdash; check it out! Leaflet is a true open source project, so we're always happy to meet new contributors, accept patches and bugreports. To help others become involved with Leaflet development and make managing contributions easier, I've put up a [Contributing to Leaflet](https://github.com/Leaflet/Leaflet/blob/master/CONTRIBUTING.md) guide with best practices and advices &mdash; check it out!
Thanks to everyone! Leaflet has got quite an amazing community which makes me really proud. Keep it up! Thanks to everyone! Leaflet has got quite an amazing community which makes me really proud. Keep it up!

7
docs/css/screen.css
View File

@ -1,5 +1,5 @@
body { body {
background: #f0f0f0; background: #f0f0f0 url(../images/paper.png);
} }
.container { .container {
@ -16,7 +16,7 @@ body {
box-shadow: 0 0 60px rgba(0,0,0,0.15); box-shadow: 0 0 60px rgba(0,0,0,0.15);
} }
h1 { h1 {
margin-bottom: 10px; margin-bottom: 0;
} }
h1 a { h1 a {
display: block; display: block;
@ -99,6 +99,7 @@ h3.alt {
font-family: Georgia, serif; font-family: Georgia, serif;
font-style: italic; font-style: italic;
font-weight: normal; font-weight: normal;
font-size: 1.7em;
} }
.container code, .container pre code { .container code, .container pre code {
@ -402,7 +403,7 @@ table.factory-table td, table.factory-table th {
} }
.social-buttons { .social-buttons {
margin: 18px 0; margin: 18px 0 0;
padding: 6px 0 2px 8px; padding: 6px 0 2px 8px;
background: #f3f3f3; background: #f3f3f3;
position: absolute; position: absolute;

BIN
docs/images/paper.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 83 KiB

8
download.md
View File

@ -13,20 +13,20 @@ Besides the library itself, the download package contains full source code, unit
<th>Description</th> <th>Description</th>
</tr> </tr>
<tr> <tr>
<td class="width100"><a href="https://github.com/CloudMade/Leaflet/zipball/v0.4.5">Leaflet 0.4.5</a></td> <td class="width100"><a href="https://github.com/Leaflet/Leaflet/zipball/v0.4.5">Leaflet 0.4.5</a></td>
<td>Stable version, released on October 25, 2012</td> <td>Stable version, released on October 25, 2012</td>
</tr> </tr>
<tr> <tr>
<td class="width100"><a href="https://github.com/CloudMade/Leaflet/zipball/v0.3.1">Leaflet 0.3.1</a></td> <td class="width100"><a href="https://github.com/Leaflet/Leaflet/zipball/v0.3.1">Leaflet 0.3.1</a></td>
<td>Previous stable version, released on February 14, 2012</td> <td>Previous stable version, released on February 14, 2012</td>
</tr> </tr>
<tr> <tr>
<td><a href="http://github.com/CloudMade/Leaflet/zipball/master">Leaflet master</a></td> <td><a href="http://github.com/Leaflet/Leaflet/zipball/master">Leaflet master</a></td>
<td>In-progress version, developed on the <code>master</code> branch</td> <td>In-progress version, developed on the <code>master</code> branch</td>
</tr> </tr>
</table> </table>
[View Changelog](https://github.com/CloudMade/Leaflet/blob/master/CHANGELOG.md) [View Changelog](https://github.com/Leaflet/Leaflet/blob/master/CHANGELOG.md)
Note that the master version can contain incompatible changes, so please read the changelog carefully when upgrading to it. Note that the master version can contain incompatible changes, so please read the changelog carefully when upgrading to it.

93
index.md
View File

@ -2,71 +2,96 @@
layout: default layout: default
--- ---
<p class="notice">October 25, 2012 &mdash; Leaflet 0.4.5 bugfix release and plans for 0.5 &mdash; <a href="2012/10/25/leaflet-0-4-5-bugfix-release-and-plans-for-0.5.html">Read More in the Blog</a></p> <!--<p class="notice">October 25, 2012 &mdash; Leaflet 0.4.5 bugfix release and plans for 0.5 &mdash; <a href="2012/10/25/leaflet-0-4-5-bugfix-release-and-plans-for-0.5.html">Read More in the Blog</a></p>-->
Leaflet is a modern open-source JavaScript library for mobile-friendly interactive maps. It is developed by [Vladimir Agafonkin][] of [CloudMade][] with a&nbsp;team of dedicated [contributors][]. Weighing just about <abbr title="That's 102 KB minified and 176 KB in the source form, with 8 KB of CSS (1.8 KB gzipped) and 10 KB of images">27 KB of gzipped JS code</abbr>, it has all the [features][] most developers ever need for online maps. Leaflet is a modern open-source JavaScript library for mobile-friendly interactive maps.
It is developed by [Vladimir Agafonkin][] with a&nbsp;team of dedicated [contributors][].
Weighing just about <abbr title="27KB gzipped &mdash; that's 102 KB minified and 176 KB in the source form, with 8 KB of CSS (1.8 KB gzipped) and 10 KB of images.">27 KB of JS code</abbr>,
it has all the [features][] most developers ever need for online maps.
Leaflet is designed with _simplicity_, _performance_ and _usability_ in mind. It works efficiently across all major desktop and mobile platforms out of the box, taking advantage of HTML5 and CSS3 on modern browsers while being accessible on older ones too. It can also be extended with many [plugins][], has a beautiful, easy to use and [well-documented][] API and a simple, readable [source code][] that is a joy to [contribute][] to. Leaflet is designed with _simplicity_, _performance_ and _usability_ in mind.
It works efficiently across all major desktop and mobile platforms out of the box,
taking advantage of HTML5 and CSS3 on modern browsers while still being accessible on older ones.
It can be extended with many [plugins][], has a beautiful, easy to use and [well-documented API][]
and a simple, readable [source code][] that is a joy to [contribute][] to.
{: .usedby} {: .usedby}
Used by: [Flickr](http://flickr.com/map) [foursquare](https://foursquare.com/) [craigslist](http://t.co/V4EiURIA) [IGN](http://www.ign.com/wikis/the-elder-scrolls-5-skyrim/interactive-maps/Skyrim) [Wikimedia](http://blog.wikimedia.org/2012/04/05/new-wikipedia-app-for-ios-and-an-update-for-our-android-app/) [Meetup](http://www.meetup.com/) [WSJ](http://projects.wsj.com/campaign2012/maps/) [Geocaching](http://geocaching.com) [StreetEasy](http://streeteasy.com/) [Nestoria](http://www.nestoria.co.uk) [Topix](http://topix.com/) [Chartbeat](http://chartbeat.com/) [GIS Cloud](http://www.giscloud.com/) ... Used by:
[Flickr](http://flickr.com/map)
[foursquare](https://foursquare.com/)
[craigslist](http://t.co/V4EiURIA)
[IGN](http://www.ign.com/wikis/the-elder-scrolls-5-skyrim/interactive-maps/Skyrim)
[Wikimedia](http://blog.wikimedia.org/2012/04/05/new-wikipedia-app-for-ios-and-an-update-for-our-android-app/)
[OSM](http://openstreetmap.org)
[Meetup](http://www.meetup.com/)
[WSJ](http://projects.wsj.com/campaign2012/maps/)
[Geocaching](http://geocaching.com)
[StreetEasy](http://streeteasy.com/)
[Nestoria](http://www.nestoria.co.uk)
[Chartbeat](http://chartbeat.com/)
[GIS Cloud](http://www.giscloud.com/)
...
<div id="map" class="map" style="height: 300px"></div> <div id="map" class="map" style="height: 300px"></div>
In this basic example, we create a map with <abbr title="Here we use the beautiful CloudMade tiles which require an API key (get one for free!), but Leaflet doesn't force you to &mdash; use whatever works for you, it's open source!">tiles of our choice</abbr>, add a marker and bind a popup with some text to it: In this basic example, we create a map with <abbr title="Here we use OpenStreetMap tiles, but Leaflet doesn't force you to &mdash; use whatever works for you, it's open source!">tiles of our choice</abbr>, add a marker and bind a popup with some text to it:
// create a map in the "map" div, set the view to a given place and zoom
var map = L.map('map').setView([51.505, -0.09], 13);
<!--- manually colored to support raw HTML inside the code --> // add an OpenStreetMap tile layer
<pre><code class="javascript"><span class="comment">// create a map in the "map" div, set the view to a given place and zoom</span> L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
<span class="keyword">var</span> map = L.map(<span class="string">'map'</span>).setView([<span class="number">51.505</span>, -<span class="number">0.09</span>], <span class="number">13</span>); attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
<span class="comment">// add a CloudMade tile layer with style #997</span>
L.tileLayer(<span class="string">'http://{s}.tile.cloudmade.com/<a href="http://cloudmade.com/register">[API-key]</a>/997/256/{z}/{x}/{y}.png'</span>, {
attribution: <span class="string">'Map data <span class="text-cut" data-cut="[&hellip;]">&amp;copy; &lt;a href="http://openstreetmap.org"&gt;OpenStreetMap&lt;/a&gt; contributors, &lt;a href="http://creativecommons.org/licenses/by-sa/2.0/"&gt;CC-BY-SA&lt;/a&gt;, Imagery © &lt;a href="http://cloudmade.com"&gt;CloudMade&lt;/a&gt;</span>'</span>
}).addTo(map); }).addTo(map);
<span class="comment">// add a marker in the given location, attach some popup content to it and open the popup</span> // add a marker in the given location, attach some popup content to it and open the popup
L.marker([<span class="number">51.5</span>, -<span class="number">0.09</span>]).addTo(map) L.marker([51.5, -0.09]).addTo(map)
.bindPopup(<span class="string">'A pretty CSS3 popup. &lt;br&gt; Easily customizable.'</span>).openPopup();</code></pre> .bindPopup('A pretty CSS3 popup. <br> Easily customizable.')
.openPopup();
Learn more with the [quick start guide](examples/quick-start.html), check out [other tutorials](examples.html), or head straight to the [API documentation](reference.html). Learn more with the [quick start guide](examples/quick-start.html), check out [other tutorials](examples.html), or head straight to the [API documentation](reference.html).
## Getting Involved ## Getting Involved
Third-party patches are absolutely essential on our quest to create the best mapping library that will ever exist. However, they're not the only way to get involved with the development of Leaflet. You can help the project tremendously by discovering and [reporting bugs][], [improving documentation][], helping others on the [Leaflet forum](https://groups.google.com/forum/#!forum/leaflet-js) and [GitHub issues](https://github.com/CloudMade/Leaflet/issues), showing your support for your favorite feature suggestions on [Leaflet UserVoice page](http://leaflet.uservoice.com), tweeting to [@LeafletJS](http://twitter.com/LeafletJS) and spreading the word about Leaflet among your colleagues and friends. Third-party patches are absolutely essential on our quest to create the best mapping library that will ever exist.
However, they're not the only way to get involved with the development of Leaflet.
You can help the project tremendously by discovering and [reporting bugs][], [improving documentation][],
helping others on the [Leaflet forum](https://groups.google.com/forum/#!forum/leaflet-js)
and [GitHub issues](https://github.com/Leaflet/Leaflet/issues),
showing your support for your favorite feature suggestions on [Leaflet UserVoice page](http://leaflet.uservoice.com),
tweeting to [@LeafletJS](http://twitter.com/LeafletJS)
and spreading the word about Leaflet among your colleagues and friends.
Check out the [contribution guide][contribute] for more information on getting involved with Leaflet development. Check out the [contribution guide][contribute] for more information on getting involved with Leaflet development.
[Vladimir Agafonkin]: http://agafonkin.com/en [Vladimir Agafonkin]: http://agafonkin.com/en
[CloudMade]: http://cloudmade.com [CloudMade]: http://cloudmade.com
[contributors]: https://github.com/CloudMade/Leaflet/graphs/contributors [contributors]: https://github.com/Leaflet/Leaflet/graphs/contributors
[features]: features.html [features]: features.html
[plugins]: plugins.html [plugins]: plugins.html
[well-documented]: reference.html "Leaflet API reference" [well-documented API]: reference.html "Leaflet API reference"
[source code]: https://github.com/CloudMade/Leaflet "Leaflet GitHub repository" [source code]: https://github.com/Leaflet/Leaflet "Leaflet GitHub repository"
[hosted on GitHub]: http://github.com/CloudMade/Leaflet [hosted on GitHub]: http://github.com/Leaflet/Leaflet
[contribute]: https://github.com/CloudMade/Leaflet/blob/master/CONTRIBUTING.md "A guide to contributing to Leaflet" [contribute]: https://github.com/Leaflet/Leaflet/blob/master/CONTRIBUTING.md "A guide to contributing to Leaflet"
[reporting bugs]: https://github.com/CloudMade/Leaflet/blob/master/CONTRIBUTING.md#reporting-bugs [reporting bugs]: https://github.com/Leaflet/Leaflet/blob/master/CONTRIBUTING.md#reporting-bugs
[improving documentation]: https://github.com/CloudMade/Leaflet/blob/master/CONTRIBUTING.md#improving-documentation [improving documentation]: https://github.com/Leaflet/Leaflet/blob/master/CONTRIBUTING.md#improving-documentation
[@mourner]: http://github.com/mourner [@mourner]: http://github.com/mourner
[GitHub issues page]: http://github.com/CloudMade/Leaflet/issues [GitHub issues page]: http://github.com/Leaflet/Leaflet/issues
[Leaflet UserVoice page]: http://leaflet.uservoice.com [Leaflet UserVoice page]: http://leaflet.uservoice.com
[@LeafletJS]: http://twitter.com/LeafletJS [@LeafletJS]: http://twitter.com/LeafletJS
[Leaflet mailing list]: https://groups.google.com/group/leaflet-js [Leaflet mailing list]: https://groups.google.com/group/leaflet-js
<script> <script>
var cloudmadeUrl = 'http://{s}.tile.cloudmade.com/BC9A493B41014CAABB98F0471D759707/997/256/{z}/{x}/{y}.png', var osmUrl = 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
cloudmadeAttribution = 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery &copy; <a href="http://cloudmade.com">CloudMade</a>', osmAttrib = '&copy; <a href="http://openstreetmap.org/copyright">OpenStreetMap</a> contributors',
cloudmade = new L.TileLayer(cloudmadeUrl, {maxZoom: 18, attribution: cloudmadeAttribution}); osm = L.tileLayer(osmUrl, {maxZoom: 18, attribution: osmAttrib});
var map = new L.Map('map'); var map = L.map('map').setView([51.505, -0.159], 15).addLayer(osm);
map.setView(new L.LatLng(51.505, -0.09), 13).addLayer(cloudmade);
var marker = new L.Marker(new L.LatLng(51.5, -0.09)); L.marker([51.504, -0.159])
map.addLayer(marker); .addTo(map)
.bindPopup('A pretty CSS3 popup.<br />Easily customizable.')
marker.bindPopup('A pretty CSS3 popup.<br />Easily customizable.').openPopup(); .openPopup();
</script> </script>

121
plugins.md
View File

@ -19,7 +19,7 @@ While Leaflet is meant to be as lightweight as possible, and focuses on a core s
</tr> </tr>
<tr> <tr>
<td> <td>
<a href="https://github.com/danzel/Leaflet.markercluster">Leaflet.markercluster</a> <a href="https://github.com/Leaflet/Leaflet.markercluster">Leaflet.markercluster</a>
</td><td> </td><td>
Beautiful, sophisticated, high performance marker clustering solution with smooth animations and lots of great features. <em>Recommended!</em> Beautiful, sophisticated, high performance marker clustering solution with smooth animations and lots of great features. <em>Recommended!</em>
</td><td> </td><td>
@ -62,6 +62,15 @@ While Leaflet is meant to be as lightweight as possible, and focuses on a core s
<a href="https://github.com/aparshin">Alexander Parshin</a> <a href="https://github.com/aparshin">Alexander Parshin</a>
</td> </td>
</tr> </tr>
<tr>
<td>
<a href="https://github.com/domoritz/leaflet-maskcanvas">MaskCanvas</a>
</td><td>
Canvas layer that can be used to visualize coverage.
</td><td>
<a href="https://github.com/domoritz">Dominik Moritz</a>
</td>
</tr>
<tr> <tr>
<td> <td>
<a href="https://github.com/sunng87/heatcanvas">HeatCanvas</a> <a href="https://github.com/sunng87/heatcanvas">HeatCanvas</a>
@ -69,6 +78,8 @@ While Leaflet is meant to be as lightweight as possible, and focuses on a core s
Simple heatmap api based on HTML5 canvas. Simple heatmap api based on HTML5 canvas.
</td><td> </td><td>
<a href="https://github.com/sunng87">Sun Ning</a> <a href="https://github.com/sunng87">Sun Ning</a>
</td>
</tr>
<tr> <tr>
<td> <td>
<a href="http://moonlite.github.com/Leaflet.MultiTileLayer/">Leaflet.MultiTileLayer</a> <a href="http://moonlite.github.com/Leaflet.MultiTileLayer/">Leaflet.MultiTileLayer</a>
@ -78,6 +89,51 @@ While Leaflet is meant to be as lightweight as possible, and focuses on a core s
<a href="https://github.com/moonlite">Mattias Bengtsson</a> <a href="https://github.com/moonlite">Mattias Bengtsson</a>
</td> </td>
</tr> </tr>
<tr>
<td>
<a href="https://github.com/openplans/Leaflet.AnimatedMarker">Leaflet.AnimatedMarker</a>
</td><td>
Animate a marker along a polyline.
</td><td>
<a href="https://github.com/atogle">Aaron Ogle</a>
</td>
</tr>
<tr>
<td>
<a href="https://github.com/jieter/Leaflet-semicircle">Leaflet-semicircle</a>
</td><td>
Adds functionality to <code>L.Circle</code> to draw semicircles.
</td><td>
<a href="https://github.com/jieter">Jieter</a>
</td>
</tr>
<tr>
<td>
<a href="https://github.com/ismyrnow/Leaflet.functionaltilelayer">Leaflet.FunctionalTileLayer</a>
</td><td>
Allows you to define tile layer URLs using a function, with support for jQuery deferreds.
</td><td>
<a href="https://github.com/ismyrnow">Ishmael Smyrnow</a>
</td>
</tr>
<tr>
<td>
<a href="https://github.com/joker-x/Leaflet.geoCSV">Leaflet.geoCSV</a>
</td><td>
Leaflet plugin for loading a CSV file as geoJSON layer.
</td><td>
<a href="https://github.com/joker-x">Iván Eixarch</a>
</td>
</tr>
<tr>
<td>
<a href="https://github.com/bbecquet/Leaflet.PolylineDecorator">Leaflet.PolylineDecorator</a>
</td><td>
Allows you to draw patterns (like dashes, arrows or evenly spaced Markers) along Polylines or coordinate paths.
</td><td>
<a href="https://github.com/bbecquet">Benjamin Becquet</a>
</td>
</tr>
</table> </table>
@ -170,6 +226,24 @@ While Leaflet is meant to be as lightweight as possible, and focuses on a core s
<a href="https://github.com/jieter">Jieter</a> <a href="https://github.com/jieter">Jieter</a>
</td> </td>
</tr> </tr>
<tr>
<td>
<a href="https://github.com/calvinmetcalf/leaflet.pouch">Leaflet.Pouch</a>
</td><td>
Use PouchDB to sync CouchDB data to local storage (indexedDB), to just add couchDB data or as just a less confusing implementation of indexedDB.
</td><td>
<a href="https://github.com/calvinmetcalf/">Calvin Metcalf</a>
</td>
</tr>
<tr>
<td>
<a href="https://github.com/calvinmetcalf/leaflet-ajax">Leaflet Ajax</a>
</td><td>
Add GeoJSON data via ajax or jsonp.
</td><td>
<a href="https://github.com/calvinmetcalf/">Calvin Metcalf</a>
</td>
</tr>
</table> </table>
@ -183,13 +257,22 @@ While Leaflet is meant to be as lightweight as possible, and focuses on a core s
</tr> </tr>
<tr> <tr>
<td> <td>
<a href="https://github.com/jacobtoye/Leaflet.draw">Leaflet.draw</a> <a href="https://github.com/Leaflet/Leaflet.draw">Leaflet.draw</a>
</td><td> </td><td>
Enables drawing features like polylines, polygons, rectangles, circles and markers through a very nice user-friendly interface with icons and hints. <em>Recommended!</em> Enables drawing features like polylines, polygons, rectangles, circles and markers through a very nice user-friendly interface with icons and hints. <em>Recommended!</em>
</td><td> </td><td>
<a href="https://github.com/jacobtoye">Jacob Toye</a> <a href="https://github.com/jacobtoye">Jacob Toye</a>
</td> </td>
</tr> </tr>
<tr>
<td>
<a href="https://github.com/danzel/Leaflet.utfgrid">Leaflet.utfgrid</a>
</td><td>
Provides a utfgrid interaction handler for leaflet a very small footprint.
</td><td>
<a href="https://github.com/danzel">Dave Leaver</a>
</td>
</tr>
<tr> <tr>
<td> <td>
<a href="https://github.com/kartena/Leaflet.EditableHandlers">Leaflet.EditableHandlers</a> <a href="https://github.com/kartena/Leaflet.EditableHandlers">Leaflet.EditableHandlers</a>
@ -201,7 +284,7 @@ While Leaflet is meant to be as lightweight as possible, and focuses on a core s
</tr> </tr>
<tr> <tr>
<td> <td>
<a href="https://github.com/kartena/Leaflet.Pancontrol">Leaflet.Pancontrol</a> <a href="http://kartena.github.com/Leaflet.Pancontrol/">Leaflet.Pancontrol</a>
</td><td> </td><td>
A simple panning control. A simple panning control.
</td><td> </td><td>
@ -210,13 +293,22 @@ While Leaflet is meant to be as lightweight as possible, and focuses on a core s
</tr> </tr>
<tr> <tr>
<td> <td>
<a href="https://github.com/kartena/Leaflet.zoomslider">Leaflet.zoomslider</a> <a href="http://kartena.github.com/Leaflet.zoomslider/">Leaflet.zoomslider</a>
</td><td> </td><td>
A zoom slider control. A zoom slider control.
</td><td> </td><td>
<a href="http://www.kartena.se/">Kartena</a> <a href="http://www.kartena.se/">Kartena</a>
</td> </td>
</tr> </tr>
<tr>
<td>
<a href="https://github.com/domoritz/leaflet-locatecontrol">Leaflet.Locate</a>
</td><td>
A customizable locate control.
</td><td>
<a href="https://github.com/domoritz">Dominik Moritz</a>
</td>
</tr>
<tr> <tr>
<td> <td>
<a href="http://elidupuis.github.com/leaflet.zoomfs">leaflet.zoomfs</a> <a href="http://elidupuis.github.com/leaflet.zoomfs">leaflet.zoomfs</a>
@ -246,13 +338,32 @@ While Leaflet is meant to be as lightweight as possible, and focuses on a core s
</tr> </tr>
<tr> <tr>
<td> <td>
<a href="https://github.com/tripbirds/leaflet-locationfilter/">leaflet-locationfilter</a> <a href="https://github.com/kajic/leaflet-locationfilter/">leaflet-locationfilter</a>
</td><td> </td><td>
A draggable/resizable rectangle for selecting an area on the map. A draggable/resizable rectangle for selecting an area on the map.
</td><td> </td><td>
<a href="https://github.com/kajic">Robert Kajic</a> <a href="https://github.com/kajic">Robert Kajic</a>
</td> </td>
</tr> </tr>
<tr>
<td>
<a href="https://github.com/Norkart/Leaflet-MiniMap">Leaflet.MiniMap</a>
</td><td>
A small minimap showing the map at a different scale to aid navigation.
</td><td>
<a href="https://github.com/robpvn">Robert Nordan</a>
</td>
</tr>
<tr>
<td>
<a href="http://erictheise.github.com/rrose">Leaflet.Rrose</a>
</td><td>
A Leaflet Plugin for Edge Cases. For use when you want popups on <em>mouseover</em>, not <em>click</em>, and
you need popup tips to reorient as you get close to the edges of your map.
</td><td>
<a href="http://www.linkedin.com/in/erictheise">Eric Theise</a>
</td>
</tr>
</table> </table>

10
reference.html
View File

@ -123,7 +123,7 @@ bodyclass: api-page
<!--<a href="#toc" id="back-to-top">&uarr;</a>--> <!--<a href="#toc" id="back-to-top">&uarr;</a>-->
<hr /> <hr />
<p>This reference reflects <strong>Leaflet 0.4.3</strong>. You can find docs for the in-progress master version in <code>reference.html</code> of <a href="https://github.com/CloudMade/Leaflet/zipball/gh-pages-master">gh-pages-master branch</a>.<br />Older docs for version 0.3 can be <a href="https://github.com/CloudMade/Leaflet/zipball/7fde9938fa36070191f939c9948285d7ddc07368">downloaded here</a></p> <p>This reference reflects <strong>Leaflet 0.4.5</strong>. You can find docs for the in-progress master version in <code>reference.html</code> of <a href="https://github.com/Leaflet/Leaflet/zipball/gh-pages-master">gh-pages-master branch</a>.<!--<br />Older docs for version 0.3 can be <a href="https://github.com/Leaflet/Leaflet/zipball/7fde9938fa36070191f939c9948285d7ddc07368">downloaded here</a>--></p>
<h2 id="map-class">L.Map</h2> <h2 id="map-class">L.Map</h2>
@ -425,12 +425,12 @@ var map = L.map('map', {
<td>Fired when the user pushes the mouse button on the map.</td> <td>Fired when the user pushes the mouse button on the map.</td>
</tr> </tr>
<tr> <tr>
<td><code><b>mouseenter</b></code></td> <td><code><b>mouseover</b></code></td>
<td><code><a href="#mouse-event">MouseEvent</a></code> <td><code><a href="#mouse-event">MouseEvent</a></code>
<td>Fired when the mouse enters the map.</td> <td>Fired when the mouse enters the map.</td>
</tr> </tr>
<tr> <tr>
<td><code><b>mouseleave</b></code></td> <td><code><b>mouseout</b></code></td>
<td><code><a href="#mouse-event">MouseEvent</a></code> <td><code><a href="#mouse-event">MouseEvent</a></code>
<td>Fired when the mouse leaves the map.</td> <td>Fired when the mouse leaves the map.</td>
</tr> </tr>
@ -3291,7 +3291,7 @@ map.panBy(new L.Point(200, 300));</code></pre>
<td>Creates a Bounds object from two coordinates (usually top-left and bottom-right corners).</td> <td>Creates a Bounds object from two coordinates (usually top-left and bottom-right corners).</td>
</tr> </tr>
<tr> <tr>
<td><code><b>L.LatLngBounds</b>( <td><code><b>L.Bounds</b>(
<nobr>&lt;<a href="#point">Point</a>[]&gt; <i>points</i> )</nobr> <nobr>&lt;<a href="#point">Point</a>[]&gt; <i>points</i> )</nobr>
</code></td> </code></td>
@ -4501,7 +4501,7 @@ L.map('map');</code></pre>
<td>Applies a unique key to the object and returns that key.</td> <td>Applies a unique key to the object and returns that key.</td>
</tr> </tr>
<!-- TODO Commented out for the time being: <!-- TODO Commented out for the time being:
https://github.com/CloudMade/Leaflet/pull/793#discussion_r1134904 https://github.com/Leaflet/Leaflet/pull/793#discussion_r1134904
<tr> <tr>
<td><code><b>requestAnimFrame</b>()</code></td> <td><code><b>requestAnimFrame</b>()</code></td>
<td></td> <td></td>