Drupal Leaflet Not Working [Solved]

Posted on October 29, 2015 - 5 Minute Read

The Leaflet Module for Drupal is probably the most popular mapping module. I was recently working on a project where I was mapping locations and displaying them on a Leaflet map both as a field formatter display and a views attachment. However, I was running into two problems:

  1. The Leaflet field formatter was not displaying on nodes
  2. The Leaflet views map was not appearing as an attachment

Make Sure The Leaflet Module and Library Are Installed Correctly

Before you go any further, make sure the module and library are installed correctly. Download that latest stable Leaflet Library and install it at /sites/all/libraries/leaflet/leaflet.js. Refer to the Leaflet Module Documentation for detailed instructions.

Leaflet Map Not Appearing On Node Display

Ok, so now that you've confirmed the library and module are installed correctly, let's debug why the Leaflet map is not appearing on a node display. In order for Leaflet to work properly, you need to have the following modules installed and enabled.

  1. Leaflet
  2. Geocoder
  3. geoPHP
  4. Geofield
  5. Address Field

Your content type needs to have two fields to geocode an address and display it as a Leaflet map:

  1. A Postal address field
  2. A Geofield that is using the Geocode from another field widget

Screen Shot 2015 10 29 at 11 15 59 AM

The Geofield needs to be configured using the following settings:

  1. The Geocode from field needs to be set with to the Postal Address field you have created in this content type

Screen Shot 2015 10 29 at 11 16 31 AM

  1. Set the Geocoder to Google Geocoder and use the default settings.

Screen Shot 2015 10 29 at 11 16 38 AM

Screen Shot 2015 10 29 at 11 16 45 AM

Screen Shot 2015 10 29 at 11 16 50 AM

  1. Navigate to your content type's display by going to admin/structure/types/manage/your-custom-content-type/display

  2. Make sure Leaflet Map is set to a map and not --select--

Screen Shot 2015 10 29 at 11 07 16 AM

Ok, now that all these settings have been configured, there's a chance that your map will still not show up. This is because you need to re-save your nodes so they can be geocoded. This typically is only an issue if you installed Leaflet after you've created nodes with postal addressees.

I recommend using Views Bulk Operations (VBO) to do a batch re-save of all nodes.

Screen Shot 2015 10 29 at 11 28 10 AM

Leaflet Views Map Not Appearing As An Attachment

It's very common to use a Leaflet Views display to show multiple locations on a Leaflet map, and use a proximity filter to narrow down results. However you might run into an issue where the map doesn't appear as an attachment.

Screen Shot 2015 10 29 at 11 34 15 AM

  1. First, make sure the attachment is set to inherit exposed filters

Screen Shot 2015 10 29 at 11 40 23 AM

  1. Make sure you added a location field to the attachment

Screen Shot 2015 10 29 at 11 41 23 AM

  1. Under the format settings for the Leaflet Map, make sure the Data Source is using the location field from step 2.

  2. Also make sure there is a map selected.

  3. Un-check Hide empty just to make sure this is not causing any issues

Screen Shot 2015 10 29 at 11 42 03 AM

  1. Under Filter Criteria make sure there is a proximity filter exposed. Make sure it has the same settings as the proximity filter used on the page this attachment is attached to.

Screen Shot 2015 10 29 at 11 44 33 AM

Screen Shot 2015 10 29 at 11 44 43 AM

  1. Finally, and most importantly, make sure the Page this attachment is attached to has AJAX turned off.
  2. ​The attachment itself can have AJAX on, but the page cannot. In my case, this is why my map didn't show up.

Screen Shot 2015 10 29 at 11 45 44 AM

Still Having Issues? Check Your Logs

Another common issue is the you've exceeded Google's Query Limit

Categorized In:Tagged In: