mapping in drupal 7 using openlayers
DESCRIPTION
Presentation from DrupalCamp Spain 2011 about OpenLayers in Drupal 7.TRANSCRIPT
Mapping in Drupalusing OpenLayers
Peter Vanhee1st October 2011 - DrupalCamp Spain
drupal7
Who am I?
‣ Consumer and contributor to Drupal for over 5 years
‣ Co-founder Youth Agora @youthagora and Nuvole @nuvoleweb
‣ Web consultant in Barcelona @pvhee
What is OpenLayers?
OpenLayers is ...
‣ a framework for building map applications
‣ javascript
‣ open source (BSD licensed)
‣ your escape from Google Maps
www.europeancampus.eu
www.managingnews.com
maps.ed.gov
Under Developmentdrupal7
drupal6 drupal7‣ Geofield
‣ Geocoder
‣ ?
‣ ?
‣ ?
‣ ?
‣ OpenLayers CCK
‣ OpenLayers Geocoder
‣ OpenLayers Filter
‣ Geo Taxonomy
‣ OpenLayers Plus
‣ OpenLayers Proximity
Note that this list is incomplete
Modules
‣ ctools
‣ openlayers openlayers_ui, openlayers_views
‣ geofieldgeoPHP
‣ views
Example
Geo Data‣ Data with
latitude/longitude (e.g. integers)
‣ CCK Field: geofieldsupports points, lines & polygons
‣ Can be anything that is available in Views!
field storage input field type
Adding geo data
with OpenLayers Map Widgetwith lat/lng fields
Data is stored in geofield
And our rendered node
Mapping in 3 steps
1. LayerServices: Google Maps, MapBox, ... Files: KML, XML, ...Drupal nodes via Views
2. MapConfiguration for a single map
3. ViewDisplays the map using Views
1. Layer2. Map3. View use Views to select data from CCK
configure data source to pick up the location
1. Layer2. Map3. View
pass additional data to the layer
1. Layer2. Map3. View
use OpenLayers module to configure map
1. Layer2. Map3. View
set layers (tiles and data) and styles
use Views to display map
1. Layer2. Map3. View
select map to display
1. Layer2. Map3. View
Step by step
Add geofield (Field)
1. Create data overlay (Views)
2. Create map (OpenLayers)
3. Render map style (Views)
Improvements
Map Behaviors
‣ Pop Up
‣ Zoom to layer
‣ Cluster
‣ Write your own(javascript)
Change Layers
‣ Google Maps
‣ MapBox
‣ Create your own (e.g. via TileMill)
set layers (tiles and data) and styles
Geoserver1. Drupal outputs WFS
via Views
2. Geoserver reads WFS and creates map
3. Openlayers reads Geoserver map, displays and facilitates interaction
http://drupal.org/project/wfsdrupal6 http://geoserver.org!
Tilemill
Create your own tiles, and render in Drupal
Extending via Contributed Modules
https://github.com/developmentseed/openlayers_plus
openlayers_plus
scale points, add tooltips, ...
drupal6source: www.europeancampus.eu
‣ From address to location
‣ Use geocoder services (e.g. Google Geocoder)
‣ Can take values from Address Field or any other text
geocoder drupal7
!
geocoder drupal7
geocoder drupal7
Would be nice to...
!
‣ Render live output of geocoding
‣ For Drupal 6, check out the excellent Openlayers Geocoder by @nuvoleweb
Extending via Code
hook_openlayers_behaviors()hook_openlayers_styles()
‣ hook_openlayers_map_preprocess_alter()hook_openlayers_map_alter()
‣ hook_openlayers_layer_types()hook_openlayers_layers()
‣ hook_openlayers_behaviors()
‣ hook_openlayers_styles()
‣ hook_openlayers_maps()
see openlayers.api.php
Links
‣ http://drupal.org/project/openlayers
‣ OpenLayers for Drupal 6 presentation: http://www.slideshare.net/pvhee/introduction-to-openlayers-in-drupal
Thanks!
Peter Vanhee@pvhee
Questions?
Peter Vanhee@pvhee
Importing and syncing content using FeedsSunday, 12pm, Sala Cenatic pvhee
Drupal + GIS: Convertiendo Drupal en un GeoCMSSunday, 4pm, Sala Microsoft plopesc