Placing Users on a Map in Drupal 7 - with Openlayers, Addressfield and Geocoding
Here is what I was trying to achieve:
Allow users to sign up, fill in their profile with various bits of information including address info - geocode that to get a longitude and latitude and place a markers on a map to show where users are in relation to each other.
You will need:
Addressfield - the state of the art in Drupal when it comes to getting address information. This module was developed to fullfil the needs of Drupal Commerce and it gets the right things right, including planned RDFa support.
Openlayers - Handles... layers - very flexible, exportable and allows you to use different tile providers. With power comes a complicated interface but it is worth the trouble!
Geofield - Geofield is a very good approach to the problem of how to get location information into Drupal and then pipe it into whatever mapping or other solution you need. You need Geofield because Openlayers does not offer a field to input data for Drupal 7. They have, rightly according to me, taken the decision to focus on what their main goal is (do maps) and leave things such as data entry fields to other modules.
Geocode - Geocode does the job of turning data into longitude and latitude and it will allow us to link up Addressfield with Geofield. (yes it is on github - yes it would be nice to have it on Drupal.org - check this issue if you want the details of why its not there yet). I am linking to my fork of Geocode because it includes a couple of fixes - in particular a fix to properly handle address data coming from a field attached to a Profile using Profile2.
Profile2 - A great module that allows us to attach different bundles of fields to user profiles and do various nice things like include them on the registration form or make them private. Lots of Drupal Entity goodness if that is your thing (we like entities).
Views - For aggregating location data and displaying Openlayers maps.
You will also need the GeoPHP library, which does all the heavy lifting calculations.
1. Install and activate everything and place the GeoPHP library in a libraries folder inside sites/all. Obviously, also install any modules that are dependencies to the ones above.
2. Go to admin/structure/profiles/manage and add an Addressfield field to the Profile field.
3. Also add a Geofield field and set the widget as "Geocode from another field". In the settings form for the field choose the Address field you defined above. Choose Google as the Geocoder for now.
4. Go to Openlayers API settings "openlayers/layers/settings" and set the Google API key or choose version 3.2 of the Google API which does not need a key.
At this point you can test that at least geocoding is working. Make sure to set the display settings for the Geofield to something like latitude and longitude so that you can see it producing results and then go edit your profile and add an address (you are not going to see a geocode data entry field, just the address field. Geocode is hidden as it will automatically be populated from the results of the geocoding). Once you save you should see a longitude and latitude popping up.
Ok so now we have data - the rest is easy.
5. Create a view that collects all the location data. We want to Show Profiles of Type Main (or whatever name you gave your profile type). We are not interested in a Page or a Block. Just hit save and then add an OpenLayers Data Overlay display type.
6. Add the relevant Geofield to the view and the formatter can be WKT.
7. Under the Display Format make sure to choose Openlayers Data Overlay and in settings make the data source WKT and the WKT Field the Geofield.
At this point you are aggregating location data in an Openlayers friendly format and the preview of your view should show that information (printed out in code style). Now we need to actually place this Data Overlay on a map.
8. Add another display to your view and set the format to OpenLayers Map. Save everything (we are not done yet though).
9. Go to admin/structure/openlayers/maps and add a new map. Give it a name and everything else Openlayers needs and save to move on to the configuration of the map.
10. The part we are interested is the Layers & Styles section of the map settings. You should find the Data Overlay view as an option at the bottom of that section. Enable and Activate. You are telling Openlayers to add that layer to that map.
11. Finally go back to the view - go to the Openlayers Map display and in Settings for the Format choose the map you just created.
Phew! Done. You can now collect addresses via the Addressfield, turn that data into a longitude and latitude using Geocode and Geofield and create an Openlayers Data Overlay of that data that you can place on an Openlayers map.