Geofields provide the possibility to display maps and geospatial data. In this tutorial we are using Geofield as field type together with a Leaflet map as the formatter. There are several options for form input formats, but WKT (Well Known Text) is quite simple, it's plain text defining the type (point, polygon etc.) with geocoordinates (longitude latitude) in brackets, i.e. POINT (-2.936944 50.724444) for Lyme Regis.
Be aware of the order of the coordinates (providers like googlemaps, wikipedia or geonames prints first the latitude and then the longitude) and the punctuation of dots - not commas, minutes (') or seconds (").
Prerequisites
- Leaflet needs the GeoPHP library and Geofield module. You have to use composer to manage the dependencies, so if you haven't a installed version >=2, please follow the instructions for your OS on the composer site.
- A Field with WKT data or the wisski.com example environment.
Installation
Open a console, navigate to your root-dir ...is the directory, where your Drupal website files and folders are stored (core, modules, sites, themes, .htaccess etc.), if you follow the recommended project structure it's the web folder of your project directory, i.e. /var/www/html/wisski.com/web, or C:/xampp/htdocs/wisski.com/web. and install Leaflet and all dependencies and libraries with
composer require 'drupal/leaflet'
Go to Manage Extend and check Leaflet. Install.
Usage
Go to Manage Configuration Pathbuilders Named Entities. In the row Coordinates open the OPERATIONS menu by clicking on the caret and select Configure Field. Set Geofield as the Type if the field that should be generated, Geofield (WKT) as the Type of form display for field and Leaflet Map as the Type of the formatter for field. Click Save.
Check Result
Visit WissKI Navigate Place and click on Lyme Regis. You should see a pretty map with a marker on the "Pearl of Dorset", where Mary Anning found and identified dinosaur fossils in cliffs to the east of the town.