0
Mapping in Drupalusing OpenLayersPeter Vanhee7th April 2011 - drupal.cat
Who am I?‣ Consumer and contributor to Drupal for  over 5 years‣ Co-founder Youth Agora (@youthagora)  and Nuvole (@nuvole...
europeancampus.eu
managingnews.com
2010.afghanistanelectiondata.org/maps
maps.ed.gov
What is OpenLayers?
OpenLayers is ...‣ a framework for building map  applications‣ javascript‣ open source (BSD licensed)‣ your escape from Go...
What is Drupal?
Modules‣ ctools‣ openlayers, openlayers_ui,  openlayers_cck,  openlayers_views‣ views
Example
Geo Data‣ Data with latitude/  longitude (point)‣ CCK Field:  OpenLayers WKT or  integer‣ Lines, polygons, ...‣ Can be any...
Mapping in 3 steps1. Layers   Services: Google Maps, MapBox, ...   Files: KML, XML, ...   Drupal nodes via Views2. Map pre...
1. Layer2. Map preset3. Map view                use Views to select data from CCK
1. Layer2. Map preset3. Map view    configure data source to pick up the location
1. Layer2. Map preset3. Map view                pass additional data to the layer
1. Layer2. Map preset3. Map view        use OpenLayers to configure map
1. Layer2. Map preset3. Map view            set map center and bounds
1. Layer2. Map preset3. Map view        configure map behaviors (php + javascript)
1. Layer2. Map preset3. Map view        set layers (tiles and data) and styles
1. Layer2. Map preset3. Map view                use Views to display map
1. Layer2. Map preset3. Map view                select map to display
Step by step1. Create geodata (CCK)2. Create data layer (Views)3. Create map preset (OpenLayers)4. Create map view (Views)
Improvements
Improvement #1Add mapbehaviors(Javascript)‣   Pop Up‣   Zoom to layer‣   Clustering‣   Write your own
Improvement #2Change layers‣   Google Maps‣   MapBox‣   Create your own    via TileMill
Extending viaContributed Modules
openlayers_geocoder‣ From address  to location‣ Save address in  node via token
openlayers_filters          insert map in content
geotaxonomygeo-aware terms                  term with lat/long
openlayers_plus    scale points, add tooltips, ...         https://github.com/developmentseed/openlayers_plus
Extending via Code
‣ hook_openlayers_map_preprocess_alter()  hook_openlayers_map_alter()‣ hook_openlayers_layer_types()  hook_openlayers_laye...
Drupal 7‣ Works!  2.0-alpha1‣ openlayers_cck  geofield‣ Under heavy  development
Links‣ http://drupal.org/project/openlayers‣ https://github.com/pvhee/  openlayers_demo
Thanks!    Contact:    Peter Vanhee    Twitter: @pvhee
Upcoming SlideShare
Loading in...5
×

Mapping in Drupal using OpenLayers

13,595

Published on

https://github.com/pvhee/openlayers_demo

Published in: Technology
4 Comments
10 Likes
Statistics
Notes
No Downloads
Views
Total Views
13,595
On Slideshare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
218
Comments
4
Likes
10
Embeds 0
No embeds

No notes for slide

Transcript of "Mapping in Drupal using OpenLayers"

  1. 1. Mapping in Drupalusing OpenLayersPeter Vanhee7th April 2011 - drupal.cat
  2. 2. Who am I?‣ Consumer and contributor to Drupal for over 5 years‣ Co-founder Youth Agora (@youthagora) and Nuvole (@nuvoleweb)‣ Independent consultant in Barcelona (@pvhee)
  3. 3. europeancampus.eu
  4. 4. managingnews.com
  5. 5. 2010.afghanistanelectiondata.org/maps
  6. 6. maps.ed.gov
  7. 7. What is OpenLayers?
  8. 8. OpenLayers is ...‣ a framework for building map applications‣ javascript‣ open source (BSD licensed)‣ your escape from Google Maps
  9. 9. What is Drupal?
  10. 10. Modules‣ ctools‣ openlayers, openlayers_ui, openlayers_cck, openlayers_views‣ views
  11. 11. Example
  12. 12. Geo Data‣ Data with latitude/ longitude (point)‣ CCK Field: OpenLayers WKT or integer‣ Lines, polygons, ...‣ Can be anything that is available in Views!
  13. 13. Mapping in 3 steps1. Layers Services: Google Maps, MapBox, ... Files: KML, XML, ... Drupal nodes via Views2. Map presets Configuration for a single map3. Map views Displays the map using Views
  14. 14. 1. Layer2. Map preset3. Map view use Views to select data from CCK
  15. 15. 1. Layer2. Map preset3. Map view configure data source to pick up the location
  16. 16. 1. Layer2. Map preset3. Map view pass additional data to the layer
  17. 17. 1. Layer2. Map preset3. Map view use OpenLayers to configure map
  18. 18. 1. Layer2. Map preset3. Map view set map center and bounds
  19. 19. 1. Layer2. Map preset3. Map view configure map behaviors (php + javascript)
  20. 20. 1. Layer2. Map preset3. Map view set layers (tiles and data) and styles
  21. 21. 1. Layer2. Map preset3. Map view use Views to display map
  22. 22. 1. Layer2. Map preset3. Map view select map to display
  23. 23. Step by step1. Create geodata (CCK)2. Create data layer (Views)3. Create map preset (OpenLayers)4. Create map view (Views)
  24. 24. Improvements
  25. 25. Improvement #1Add mapbehaviors(Javascript)‣ Pop Up‣ Zoom to layer‣ Clustering‣ Write your own
  26. 26. Improvement #2Change layers‣ Google Maps‣ MapBox‣ Create your own via TileMill
  27. 27. Extending viaContributed Modules
  28. 28. openlayers_geocoder‣ From address to location‣ Save address in node via token
  29. 29. openlayers_filters insert map in content
  30. 30. geotaxonomygeo-aware terms term with lat/long
  31. 31. openlayers_plus scale points, add tooltips, ... https://github.com/developmentseed/openlayers_plus
  32. 32. Extending via Code
  33. 33. ‣ hook_openlayers_map_preprocess_alter() hook_openlayers_map_alter()‣ hook_openlayers_layer_types() hook_openlayers_layers()‣ hook_openlayers_behaviors()‣ hook_openlayers_styles()‣ hook_openlayers_presets() see openlayers.api.php
  34. 34. Drupal 7‣ Works! 2.0-alpha1‣ openlayers_cck geofield‣ Under heavy development
  35. 35. Links‣ http://drupal.org/project/openlayers‣ https://github.com/pvhee/ openlayers_demo
  36. 36. Thanks! Contact: Peter Vanhee Twitter: @pvhee
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×