Skip to content

andrewl/leaflet

Repository files navigation

This module provides integration with Leaflet map scripting library,
http://leafletjs.com

*NB This is a fork of the project on drupal.org which includes some patches for
critical and non-critical issues including:
- "LeafletMarker could not recognize geofield" (https://www.drupal.org/node/2839538)
- "Style Leaflet requires a leaflet map to be configured" (https://www.drupal.org/node/2683221)
- "Integration with Geolocation" (https://www.drupal.org/node/2720901)

To use it you must have the Leaflet library installed. You can do this manually, or using composer. (see below)

In its current state, maps can be rendered as follows:
o via the included field formatter for Geofield (drupal.org/project/geofield)
and Geolocation (drupal.org/project/geolocation)
o via Views (and Geofield)
o by using the API directly.


Installation (composer)
-----------------------

1. Run $ composer require drupal/leaflet:~1.0

2. Add the proper repository to the composer.json file in your project root (NB not the module composer.json) to be able to require
   the JS library:
    {
      "type": "package",
      "package": {
        "name": "leaflet/leaflet",
        "version": "1.0.2",
        "type": "drupal-library",
        "dist": {
          "url": "https://github.com/Leaflet/Leaflet/archive/v1.0.2.zip",
          "type": "zip"
        }
      }
    }

3. Run $ composer require leaflet/leaflet:~1.0

4. Enable Drupal modules as usual.

Installation (manual)
---------------------

1. Normal Drupal module installation

2. Download the Leaflet library from http://leafletjs.com/. Leaflet 1.0.2 or
   higher is recommended

3. Enable leaflet_views for using Views and Leaflet (see below), or use the
   display formatters for fields display.



API Usage
---------
Rendering a map is as simple as calling a single method, leaflet_render_map(),
which takes 3 parameters.

$map
An associative array defining a map. See hook_leaflet_map_info(). The module
defines a default map with a OpenStreet Maps base layer.

$features
This is the tricky part. This is an associative array of all the features you
want to plot on the map. A feature can be a point, linestring, polygon,
multipolygon, multipolygon, or json object. Additionally, features can be
grouped into layer groups so they can be controlled together,
http://leafletjs.com/reference.html#layergroup. A feature will look something
like:

$features = array(
  array(
    'type' => 'point',
    'lat' => -12,
    'lon' => 123.45,
    'icon' => array(
      'iconUrl' => 'sites/default/files/mymarker.png
    ),
    'popup' => l($node->title, 'node/' . $node->nid),
    'leaflet_id' => 'some unique ID'
  ),
  array(
    'type' => 'linestring',
    'points' => array(
      0 => array('lat' =>  13, 'lon' => 123),
      1 => array('lat' =>  14, 'lon' => -123),
      2 => array('lat' => -15, 'lon' => 123),
      3 => array('lat' =>  16, 'lon' => 123),
      4 => array('lat' => -17, 'lon' => 123),
    ),
    'popup' => l($node->title, 'node/' . $node->nid),
    'leaflet_id' => 'some unique ID'
  ),
  array(
    'type' => 'json',
    'json' => [JSON OBJECT],
    'properties' = array(
      'style' => [style settings],
      'leaflet_id' => 'some unique ID'
    )
  )
);

Views integration
-----------------

To render a map using Views, enable the module leaflet_views.

You need to add at least one geofield or geolocation field to the Fields list, and select the Leaflet
Map style in Format.

In the settings of the style, select the geofield as the Data Source and select
a field for Title and Description (which will be rendered in the popup).

As a more powerful alternative, you can use node view modes to be rendered in
the popup. In the Description field, select "<entire node>" and then select a
View mode.

For a tutorial, please read
http://marzeelabs.org/blog/2012/09/24/building-maps-in-drupal-using-leaflet-views

Roadmap
-------

* UI for managing maps
* Better documentation


Authors/Credits
---------------

* [levelos](http://drupal.org/user/54135)
* [pvhee](http://drupal.org/user/108811)