2012-07-17 01:21:00 +08:00
<!DOCTYPE html>
< html >
< head >
2012-07-18 05:32:50 +08:00
{% capture title %}{% if page.title %}{{ page.title }} - {% elsif post.title %}{{ post.title }} - {% endif %}{% endcapture %}
< title > {{ title }}Leaflet - a JavaScript library for mobile-friendly maps< / title >
2012-07-17 01:21:00 +08:00
< meta charset = "utf-8" / >
2012-07-19 16:32:09 +08:00
2012-07-17 01:21:00 +08:00
< 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:image" content = "http://leaflet.cloudmade.com/docs/images/logo.png" / >
2012-07-19 16:32:09 +08:00
2012-07-17 01:21:00 +08:00
< meta itemprop = "name" content = "Leaflet" >
< meta itemprop = "description" content = "Leaflet — a modern, lightweight open-source JavaScript library for mobile-friendly interactive maps." >
< meta itemprop = "image" content = "http://leaflet.cloudmade.com/docs/images/logo.png" >
< meta name = "viewport" content = "width=device-width, initial-scale=1.0" >
{% capture root %}{% if page.root %}{{ page.root }}{% else %}{{ post.root }}{% endif %}{% endcapture %}
< link rel = "icon" type = "image/png" href = "{{ root }}docs/images/favicon.png" / >
2012-07-29 07:20:15 +08:00
< link href = "http://leaflet.cloudmade.com/atom.xml" type = "application/atom+xml" rel = "alternate" title = "Leaflet Dev Blog Atom Feed" / >
2012-07-17 01:21:00 +08:00
<!-- Blueprint -->
< link rel = "stylesheet" href = "{{ root }}docs/css/blueprint/screen.css" media = "screen, projection" >
< link rel = "stylesheet" href = "{{ root }}docs/css/blueprint/print.css" media = "print" >
<!-- [if lt IE 8]><link rel="stylesheet" href="docs/css/blueprint/ie.css" media="screen, projection"><![endif] -->
< link rel = "stylesheet" href = "{{ root }}docs/css/screen.css" media = "screen, projection" / >
< script src = "{{ root }}docs/highlight/highlight.pack.js" > < / script >
< link rel = "stylesheet" href = "{{ root }}docs/highlight/styles/github.css" / >
<!-- Leaflet -->
< link rel = "stylesheet" href = "{{ root }}dist/leaflet.css" / >
<!-- [if lte IE 8]><link rel="stylesheet" href="dist/leaflet.ie.css" /><![endif] -->
< script src = "{{ root }}dist/leaflet.js" > < / script >
2012-07-26 00:50:59 +08:00
2012-08-07 22:45:47 +08:00
{% if page.css %}< style > { { p a g e . c s s } } < / style > {% endif %}
2012-07-26 00:50:59 +08:00
< script >
CM_ATTR = 'Map data © < a href = "http://openstreetmap.org" > OpenStreetMap< / a > contributors, ' +
'< a href = "http://creativecommons.org/licenses/by-sa/2.0/" > CC-BY-SA< / a > , ' +
'Imagery © < a href = "http://cloudmade.com" > CloudMade< / a > ';
CM_URL = 'http://{s}.tile.cloudmade.com/BC9A493B41014CAABB98F0471D759707/{styleId}/256/{z}/{x}/{y}.png';
< / script >
2012-07-17 01:21:00 +08:00
< / head >
2012-07-19 16:32:09 +08:00
< body { % if page . bodyclass % } class = "{{ page.bodyclass }}" { % endif % } >
2012-07-17 01:21:00 +08:00
< div class = "container" >
2012-07-17 06:11:39 +08:00
< h1 > < a href = "http://leaflet.cloudmade.com" > Leaflet< / a > < / h1 >
2012-07-17 21:56:49 +08:00
< h3 class = "alt" > An Open-Source JavaScript Library for Mobile-Friendly Interactive Maps by < a href = "http://cloudmade.com" > CloudMade< / a > < / h3 >
2012-07-17 01:21:00 +08:00
2012-07-18 16:25:20 +08:00
< div class = "social-buttons" >
2012-08-09 06:12:05 +08:00
<!-- <iframe src="http://markdotto.github.com/github - buttons/github - btn.html?user=CloudMade&repo=Leaflet&type=watch&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="113px" height="20px"></iframe> -->
2012-07-18 16:25:20 +08:00
<!-- <iframe src="http://markdotto.github.com/github - buttons/github - btn.html?user=CloudMade&repo=Leaflet&type=fork&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="96px" height="20px"></iframe> -->
< a href = "http://twitter.com/share" class = "twitter-share-button" data-url = "http://leaflet.cloudmade.com" data-text = "Leaflet — an open-source JavaScript library for mobile-friendly interactive maps by @cloudmade" data-via = "LeafletJS" data-related = "CloudMade" > Tweet< / a >
< a href = "https://twitter.com/LeafletJS" class = "twitter-follow-button" data-show-count = "true" data-show-screen-name = "false" > Follow @LeafletJS< / a >
2012-07-19 16:32:09 +08:00
2012-07-18 16:25:20 +08:00
< script > ! function ( d , s , id ) { var js , fjs = d . getElementsByTagName ( s ) [ 0 ] ; if ( ! d . getElementById ( id ) ) { js = d . createElement ( s ) ; js . id = id ; js . src = "http://platform.twitter.com/widgets.js" ; fjs . parentNode . insertBefore ( js , fjs ) ; } } ( document , "script" , "twitter-wjs" ) ; < / script >
< iframe src = "http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fleaflet.cloudmade.com&layout=button_count&show_faces=false&width=430&action=like&font=arial&colorscheme=light&height=35" scrolling = "no" frameborder = "0" style = "border:none; overflow:hidden; width:87px; height:20px;" allowTransparency = "true" > < / iframe >
<!-- <div class="g - plusone" data - size="medium" data - href="http://leaflet.cloudmade.com/"></div>
< script type = "text/javascript" >
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
< / script > -->
< / div >
2012-07-17 01:21:00 +08:00
< ul class = "nav clearfix" >
<!-- <li><a class="cloudmade - link" href="http://cloudmade.com"></a></li> -->
< li >
{% if page.title == nil %}
< span > Overview< / span >
{% else %}
< a href = "{{ root }}index.html" > Overview< / a >
{% endif %}
< / li >
< li >
{% if page.title == 'Features' %}
< span > Features< / span >
{% else %}
< a href = "{{ root }}features.html" > Features< / a >
{% endif %}
< / li >
< li >
{% if page.title == 'Tutorials' %}
< span > Tutorials< / span >
{% else %}
2012-07-23 15:20:49 +08:00
< a href = "{{ root }}examples.html" { % if page . tutorial = = true % } class = "active" { % endif % } > Tutorials< / a >
2012-07-17 01:21:00 +08:00
{% endif %}
< / li >
< li >
{% if page.title == 'Documentation' %}
2012-07-17 21:56:49 +08:00
< span > API< / span >
2012-07-17 01:21:00 +08:00
{% else %}
2012-07-17 21:56:49 +08:00
< a href = "{{ root }}reference.html" > API< / a >
2012-07-17 01:21:00 +08:00
{% endif %}
< / li >
< li >
{% if page.title == 'Download' %}
2012-07-17 06:11:39 +08:00
< span > Download< / span >
2012-07-17 01:21:00 +08:00
{% else %}
< a href = "{{ root }}download.html" > Download< / a >
{% endif %}
< / li >
2012-07-18 05:41:26 +08:00
< li >
{% if page.title == 'Plugins' %}
< span > Plugins< / span >
{% else %}
< a href = "{{ root }}plugins.html" > Plugins< / a >
{% endif %}
< / li >
< li >
{% if page.title == 'Blog' %}
< span > Blog< / span >
{% else %}
2012-07-29 07:20:15 +08:00
< a href = "{{ root }}blog.html" { % if page . post = = true % } class = "active" { % endif % } > Blog< / a >
2012-07-18 05:41:26 +08:00
{% endif %}
< / li >
2012-07-17 21:04:55 +08:00
< li > < a class = "forum-link" href = "https://groups.google.com/forum/#!forum/leaflet-js" > Forum< / a > < / li >
2012-07-17 01:21:00 +08:00
< 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 >
< / ul >
{{ content }}
2012-07-17 21:56:49 +08:00
< div class = "footer" >
< hr / >
2012-07-21 06:11:26 +08:00
< p class = "quiet" > © 2011– 2012 < a href = "http://cloudmade.com" > CloudMade< / a > , < a href = "http://agafonkin.com/en" > Vladimir Agafonkin< / a > . Map data © 2012 < a href = "http://openstreetmap.org" > OpenStreetMap< / a > contributors, < a href = "http://creativecommons.org/licenses/by-sa/2.0/" > CC-BY-SA< / a > .< / p >
2012-07-17 21:56:49 +08:00
< / div >
2012-07-17 01:21:00 +08:00
< / 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 >
< script >
hljs.tabReplace = ' ';
(function () {
2012-07-25 23:51:38 +08:00
var codes = document.getElementsByTagName('code'),
parentClass;
2012-07-17 01:21:00 +08:00
for (var i = 0, len = codes.length; i < len ; i + + ) {
if (!codes[i].className) {
2012-07-25 23:51:38 +08:00
parentClass = codes[i].parentNode.className;
if (parentClass) {
codes[i].className = parentClass;
} else if (codes[i].innerHTML.match(/^\s*< /)) {
2012-07-17 01:21:00 +08:00
codes[i].className = 'xml';
} else {
codes[i].className = 'javascript';
}
}
}
})();
hljs.initHighlighting();
< / script >
< script >
var _gaq = _gaq || [];
_gaq.push([ '_setAccount', 'UA-4147697-4' ]);
_gaq.push([ '_trackPageview' ]);
(function() {
var ga = document.createElement('script');
ga.type = 'text/javascript';
ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl'
: 'http://www')
+ '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(ga, s);
})();
< / script >
< script >
var uvOptions = {};
(function() {
var uv = document.createElement('script'); uv.type = 'text/javascript'; uv.async = true;
uv.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + 'widget.uservoice.com/ygv5CFpu3yBQFTFPOAdFg.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(uv, s);
})();
< / script >
< / body >
< / html >
