Leaflet.js Essentials

Book description

Create interactive, mobile-friendly mapping applications using the incredibly light yet powerful Leaflet.js platform

In Detail

Starting with how to create maps, you will learn about choosing your basemap and customizing it by adding various attributes such as zoom, start view, pop ups, and so on.

Once you have gained experience of creating your own map with Leaflet, you will move on to combining Leaflet with GeoJSON and adding geometry objects and features to your maps.

Moving ahead, you will proceed to create custom markers using images and discover various plugins such as the Cluster Marker plugin, the Bouncing Marker, and the Animated Marker to animate and move markers. You will then explore the latest ESRI features available on Leaflet and make use of its updated JavaScript library.

Finally, you will understand how Leaflet enables you to use Node.js, C#, and Python alongside its own library to efficiently create maps.

What You Will Learn

  • Incorporate Tile Layers and Web Mapping Services into your map
  • Write custom functions that use events to make interactive maps
  • Add GeoJSON data to a web map
  • Create your own images to use as markers on your map
  • Build desktop applications using C#
  • Make heatmaps and chloropleth maps
  • Take advantage of third-party plugins to enhance your map

Publisher resources

Download Example Code

Table of contents

  1. Leaflet.js Essentials
    1. Table of Contents
    2. Leaflet.js Essentials
    3. Credits
    4. About the Author
    5. About the Reviewers
    6. www.PacktPub.com
      1. Support files, eBooks, discount offers, and more
        1. Why subscribe?
        2. Free access for Packt account holders
    7. Preface
      1. What this book covers
      2. What you need for this book
      3. Who this book is for
      4. Conventions
      5. Reader feedback
      6. Customer support
        1. Downloading the example code
        2. Errata
        3. Piracy
        4. Questions
    8. 1. Creating Maps with Leaflet
      1. Creating a simple basemap
        1. Referencing the JavaScript and CSS files
          1. Using a hosted copy
          2. Using a local copy
        2. Creating a <div> tag to hold the map
        3. Creating a map object
        4. Adding a tile layer
      2. Tile layer providers
      3. Adding a Web Mapping Service tile layer
      4. Multiple tile layers
      5. Adding data to your map
        1. Points
        2. Polylines
        3. Polygons
      6. Rectangles and circles
        1. Rectangles
        2. Circles
      7. MultiPolylines and MultiPolygons
        1. MultiPolylines
        2. MultiPolygons
      8. Groups of layers
        1. The layer group
        2. Feature groups
      9. Pop ups
      10. Mobile mapping
        1. HTML and CSS
        2. Creating a mobile map with JavaScript
      11. Events and event handlers
        1. Custom functions
      12. Summary
    9. 2. Mapping GeoJSON Data
      1. Understanding the roots of GeoJSON
      2. Exploring GeoJSON
      3. GeoJSON in Leaflet.js
        1. GeoJSON as a variable
        2. Multiple geometries in GeoJSON
          1. Polygons with holes
        3. GeoJSON from Leaflet.js objects
        4. Styling GeoJSON layers
        5. Iterating through the features
          1. Attaching pop ups with onEachFeature
          2. Creating layers from points with pointToLayer
          3. Displaying a subset of data with filter
      4. Summary
    10. 3. Creating Heatmaps and Choropleth Maps
      1. What is a heatmap?
      2. Heatmaps with Leaflet.heat
        1. Using options to style your map
          1. Changing the blur value
          2. Changing the maxZoom value
          3. Changing the radius value
          4. Setting the gradient option
        2. Methods of Leaflet.heat
        3. Adding markers to the heatmap
      3. Creating heatmaps with heatmap.js
        1. Modifying the heatmap options
        2. Adding more data to the map
      4. Creating an interactive heatmap
      5. Animating a heatmap
      6. Creating a choropleth map with Leaflet
        1. The GeoJSON data
        2. Setting the color with a function
        3. Styling the GeoJSON data
      7. Creating a normalized choropleth map
      8. Summary
    11. 4. Creating Custom Markers
      1. Creating a custom marker
        1. Preparing your workspace in GIMP
        2. Drawing and saving your image
        3. Drawing the marker shadow
        4. Using an image as an icon
      2. Using a custom marker in Leaflet
        1. Defining an L.Icon class
      3. Using predefined markers with plugins
        1. Using Mapbox Maki markers
        2. Using Bootstrap and Font Awesome markers
      4. Clustering markers with Leaflet.markercluster
        1. Coding your first cluster map
        2. Methods and events available to markercluster layers
          1. Options that default to true
          2. Other options and events
      5. Animating markers with plugins
        1. Bouncing your markers
        2. Making your markers move
      6. Using markers for data visualization
        1. Using the Leaflet Data Visualization Framework plugin
          1. Creating basic markers
            1. MapMarker options
            2. RegularPolygonMarker options
            3. StarMarker options
        2. Bar and pie chart markers
      7. Summary
    12. 5. ESRI in Leaflet
      1. ESRI basemaps
      2. Using shapefiles in Leaflet
      3. Consuming ESRI services
      4. Heatmaps with ESRI in Leaflet
      5. Geocoding addresses in Leaflet
        1. Geocoding – from an address to a point
        2. Geocoding from URL parameters
        3. Reverse geocoding – using points to find addresses
      6. Query by attribute
      7. Query by proximity
      8. Summary
    13. 6. Leaflet in Node.js, Python, and C#
      1. Building Leaflet applications with Node.js
        1. A basic Node.js server with Leaflet
        2. Node.js, AJAX, and Leaflet
        3. Node.js, Connect, and Leaflet
        4. Node.js, Express, Jade, and Leaflet
      2. Leaflet with Python and CherryPy
        1. Spatial queries with Python, MongoDB, and Leaflet
      3. Desktop applications in C# with Leaflet
        1. Adding a map to a C# application
        2. Adding a marker in C#
        3. Using MongoDB with C# and Leaflet
        4. Querying with C#, Leaflet, and MongoDB
      4. Summary
    14. Index

Product information

  • Title: Leaflet.js Essentials
  • Author(s): Paul Crickard III
  • Release date: August 2014
  • Publisher(s): Packt Publishing
  • ISBN: 9781783554812