Check your version

This collection covers a topic in Drupal 7 which may or may not be the version you're using. We're keeping this tutorial online as a courtesy to users of Drupal 7, but we consider it archived.

Mapping with Leaflet

Leaflet is a Drupal mapping module that is quickly gaining attention for its mobile-friendly interactive controls, simple configuration, and lightweight file size. There is a stable version available for Drupal 7 and a branch in development for Drupal 8. The Leaflet contributed module integrates CloudMade's JavaScript library for interactive maps and provides a field formatter, Views integration, and a developer API. If you are looking for a mapping solution that you can quickly get up and running, then join Amber Matz for the series Mapping with Leaflet and learn how to add beautiful, mobile-friendly maps to your Drupal 7 site.

Leaflet uses Geofield to store a variety of geographical data and formats. So, before we can start mapping, we need to have a way to capture location data in Drupal. Amber will walk you through how to install and configure Geofield for a new content type. Then we'll add Leaflet to the mix and display a latitude/longitude point on an OpenStreetMap.

Next, we'll explore another option for location data storage: geocoded postal addresses. Amber will show you how to configure a Feeds Importer for importing addresses into AddressField and configure Geofield to automatically geocode postal addresses for display on a map.

Finally, you'll learn how to use Views and Leaflet display a map of multiple locations. Then, we'll look at various ways to customize Leaflet and override its default settings.

After completing this series, you should be able to (on a Drupal 7 site):

  • Use Geofield to store geospatial data
  • Use Leaflet to display single and multiple locations on a map
  • Configure Drupal to Geocode postal addresses upon data entry or import
  • Use Views to create maps with Leaflet
  • Implement various features of the Leaflet library such as customizing map marker icons, swapping out base map layers, enabling marker clustering, and overriding other default settings.

This series provides a solid introduction to Leaflet and Geofield, one of several mapping solutions available in Drupal (see Comparison of mapping modules on drupal.org.) Leaflet's features are extended by a number of different contributed modules. With the growing relevance of location data in web sites and applications, Leaflet is an up-and-coming solution worth adding to your Drupal site building tool kit.