leafletjs-kit.html

<!DOCTYPE html>
<html lang="en-us">
  <head>
    <meta charset="utf-8" />
    <title>LeafletJS Kit</title>
    <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0;" />
    <link type="text/css" rel="stylesheet" href="style.css" />
  </head>
  <body>
    <div class="content">
      <header role="banner"><h1 class="header-logo">LeafletJS Kit &#45; Get Your Open Source Maps Goodness On.</h1></header>
      <div class="main" role="main">
        <article role="article">
          <section role="region">
            <h1></h1>
            <p><a href="http://leafletjs.com/">Leaflet &#45; An Open&#45;Source JavaScript Library for Mobile&#45;Friendly Interactive Maps</a> <a href="http://leafletjs.com/plugins.html">LeafletJS Plug&#45;ins List</a>
              <a href="http://leafletjs.com/examples/quick-start.html">Quick Start Guide</a> <a href="https://github.com/Leaflet/Leaflet">GitHub Repository</a></p>
            <ul>
              <li><a href="#leaflet-overintent">Leaflet.OverIntent</a></li>
              <li><a href="#leaflet-ajax">leaflet-ajax</a></li>
              <li><a href="#leaflet-interactive-scalable">Interactive Scalable Demo</a></li>
            </ul>
            
            <h3 id="leaflet-almost-over">Leaflet.AlmostOver</h3>
            <p><strong>Leaflet.AlmostOver</strong> plugin allows you to detect mouse click and overing events on lines, with a tolerance distance.</p>
            <p>It is useful if paths are drawn with a very small weight, or for clicks detection on mobile devices, for which finger precision can be a problem.</p>
            <p>It requires <a href="https://github.com/makinacorpus/Leaflet.GeometryUtil">Leaflet.GeometryUtil</a>.</p>
            <p><cite><a href="https://github.com/makinacorpus/Leaflet.AlmostOver">Leaflet.AlmostOver on GitHub</a></cite></p>
            
            <h3 id="leaflet-ajax">leaflet-ajax</h3>
            <p>Allows you to call JSON via an Ajax call with a jsonp fallback.</p>
            <pre><code>var geojsonLayer = new L.GeoJSON.AJAX("geojson.json");</code></pre>
            <p>for jsonp add the option "dataType" and set it to "jsonp"</p>
            <pre><code>var geojsonLayer = L.geoJson.ajax("http:webhost.fake/geojson.jsonp",{dataType:"jsonp"});</code></pre>
            <p><strong>Note</strong>: that data starts to download when the layer is created NOT when it’s added to the map in order to get a head start.
              <a class="block" href="leaflet-ajax.html">leaflet-ajax Demo</a></p>
            <p><cite><a href="https://github.com/calvinmetcalf/leaflet-ajax">leaflet-ajax</a></cite></p>
            
            <h3 id="leaflet-interactive-scalable"><a href="leaflet-interactive-scalable.html">Interactive Scalable Demo</a></h3>
            <p>In this tutorial we will create a data-driven mapping application to plot the location of London train stations. We will see how we can build up the various layers of the map, including the zoom and scale controls, and we’ll obtain our geographic tiles for display from a third-party client. We’ll also incorporate some simple functions to update the style of the generated tiles directly from our map interface.</p>
            <p>The Leaflet.js mapping tool needs access to tiles – the square images that are pieced together to make the map. There are many tile providers out there, and you can host your own server if you wish. For this tutorial, we will use CloudMade. Head over to <a href="http://cloudmade.com">cloudmade.com</a>, sign up for a free developer account, and obtain your API key.
              <a class="block" href="leaflet-interactive-scalable.html">Interactive Scalable Demo</a></p>
            <p><cite><a href="http://www.webdesignermag.co.uk/tutorials/15569/">Build Stylish, Interactive Maps with LeafletJS</a></cite></p>
            
            
            <h3 id="leaflet-overintent">Leaflet.OverIntent</h3>
            <p>Aiming is neater than clicking! This plugin adds a new event mouseintent, that differs from mouseover since it reflects user intentions to aim a particular layer.
              <a class="block" href="leaflet-overintent-demo.html">Leaflet.OverIntent Demo</a></p>
            <p><cite><a href="https://github.com/makinacorpus/Leaflet.OverIntent">Leaflet.OverIntent</a></cite></p>
            <h3 id=""></h3>
            <p></p>
            <p><cite><a href=""></a></cite></p>
            
            <h3>References and Resources</h3>
            <ul>
              <li><a href="https://gist.github.com/jalbertbowden/6837166">Leaflet maps with shapefile&#45;derived Geo<abbr>json</abbr></a></li>
              <li><a href="https://github.com/makinacorpus/Leaflet.MeasureControl">Leaflet.MeasureControl &#45; Leaflet control to measure distances on the map</a></li>
              <li><a href="https://p2pu.org/en/groups/online-maps-with-leaflet/content/leafletjs-walkthrough/">LeafletJS Walkthrough</a></li>
            </ul>
            </section>
          </article>
        </div>
      <footer><h3></h3></footer>
    </div>
  </body>
</html>