Addressfield with Geofields in Openlayers

Introduction

A recent comment asked about addressfields, I had no yet used these so I thought it would be a good opportunity to try it out.

Though for people new to Drupal it may seem a little daunting with the number of modules to install and openlayers & views setup so I thought I would put a tutorial together demonstrating a basic implementation of using addressfields in Drupal 7.

For my example I'll be using landmarks in the city of London and entering points of interest to the geofield via the addressfield.

Pre-requirsites

Make sure you do this tutorial first. It will get you familiar with Openlayers & views.

Modules

Here's a list of the Drupal 7 libraries and modules you will need

Here is the drush command I'll be using to download and enable the modules. Note some of them will be dev versions

 
drush dl openlayers-7.x-2.x-dev geofield-7.x-2.x-dev geocoder-7.x-1.x-dev addressfield-7.x-1.x-dev geophp views ctools libraries-7.x-2.x-dev
drush en openlayers_views, openlayers_ui, openlayers, geofield_map, geofield, geocoder, addressfield, geophp,views, views_ui, ctools, libraries

Implementation

  • Add a new map to Openlayers
  • Create a new content type
  • Add a addressfield and geofield to the content type. For the geofield ensure the 'geocode from another field is enabled'
  • Now create some content types. I'll be selecting POI's in London
  • Create a new view and add the OpenLayers Data Overlayer view. I won't go into details over setting up the display, check the first tutorial for reference
  • Once the view has been completed, edit the openlayers map and enable the layer that has been generated by views.
  • Go back into the view and add a page display, then enable the Openlayers format and set a path
  • That's it, go to your path address and you should now have your dots appearing on a map at the path you specified.

Conclusion

Entering geocode data via the addressfield mechanism seems to be a popular use case and this tutorial hopefully demonstrated this.

There were a number of extra and new modules required to allow the addressfield data to be geocoded through to the geofields but once setup the rest was just the standard openlayers & views configuration, which if you have done the previous Openlayers tutorials will seem very familar

That's all for this one, hopefully you got something out of it and remember don't forget to flush your cache.

Comments

Submitted by Christophe (not verified) on

Hello,

Congratulations!!!!
This is a very clear and good tutorial to understand how it's works for integration Openlayers.
I want also make a site with POI's with OL, but it was very difficult to understand on other sites, but this tutorial is very good to understand.

Grtz.

Submitted by nigel on

Thank you for the kind comments Christophe, I do find that video tutorials add extra dimensions that make it easier to learn. You may want to checkout the other Openlayers tutorials in this site to help you with your POIs.

Submitted by Kurt (not verified) on

Great tutorials. Thank you. I had one question for you. When you are creating a new content type, which is only input for Address line one and country how to you get the preview of the returned Google Geocoder location (lat. and long.) ? Do you save content type, because when I do this and it is checked off as a required field I get 'postal code' required with no Geocoder location. It saves but does not return this Geocoder location when it is not a required field.
When trying to preview I get an error from field.form.inc line 203. Although this could be related to that module.

Submitted by nigel on

I made no additional changes to the content type other than what was described on the video. By default it was displaying the geocoder locations after saving. At this moment in time check that you are using the dev versions of addressfield, geocoder and openlayers.

Addiitional thoughts, I gather you have selected the UK for addressfields, have you tried entered a postal code as well?

Submitted by Phil (not verified) on

Great tutorial as usual. Is there a way to get directions from one place (users location) to another (users destination) using this openlayers, geofield, addressfield & geocoder setup or a similar setup?

Many thanks

Submitted by nigel on

Currently I don't know of an implementation that does this using Openlayers & Addressfields. There is a third piece to the puzzle that is missing which is the route algorithm part that traverses roads along with the road data.

Submitted by emma (not verified) on

great tutorial! is there a way to link points with line in the view?

Submitted by TARSTAR2 (not verified) on

Hello, Thank you so much. I had a basic understanding of this and your great video presentation tied it all together for me. I have one question. Say you have a content type with existing addressfield's... Is it possible to add the geocode field then and update all existing content or would I have to reenter all my addresses again. Any help would be very much appreciated.

Submitted by Tomas Kliment (not verified) on

Hi, thanks a lot for beautiful video.
Nevertheless, I would like to ask you, whether it's possible to configure geofield module with openlayers to fulfil this scenario:
User has in a form Openlayer field and Geofield Bounds widget, he wants to define a geographical extent by drawing a box on a map. The coordinated from the box bounds are then populating the Geofield bounds widget - Top, Right, Bottom and Left.
Is there a way to perform such a configuration? Or it is impossible to achieve with the current modules (openlayers+geofield)?
Thanks a lot for any feedback,

Submitted by Danilo (not verified) on

I wish there was a way of accomplishing this using Solr search.

Submitted by Barry (not verified) on

Hi, Thanks for the very informative and helpful videos, Great work!
I have a question about a related implementation that I was thinking about. I want to use openlayers map and the addressfield to allow users to place a location marker on a map. But to help the user narrow down the area in which they place the marker, I want them to be able to select a country (the the dynamic map will then zoom to the extents of that country) then, select a city within that country (again the map will zoom to the extents of that city) . The user can then drop a pin in the desired location within the city.
I'm not sure if this is possible with the address field, or would I be better off creating my own taxonomy for countries and cities and manually setting it up that way. I'd would love to hear your thoughts, keep up the good work!
btw, I am already geolocating the user to narrow down the pin drop area, this would an addition to this to help users on desktops.

Submitted by nigel on
behaviour. Openlayers behaviour is static, ie you have to save the geofield content type before it gets routed through the views and openlayers, so the easiest solution would be to use taxonomy terms as you mention, though it's not ideal for maintenance reasons. Out of curiosity what mechanism are you using for your pin placement? When I get the chance I'll start playing with Apache Solr which may provide a more polished solution to what you are trying to achieve.

Submitted by Barry (not verified) on

Thanks for your reply Nigel,
I will try setting it up with taxonomy terms, but as you said, it's a bit daunting with that many terms to maintain in the future. I'm a novice with Drupal, but i'm using Geofield with an openlayers map to place the pin within a form (the map is a copy of the default Geofield Widget map). The map has the Geofield 'point' feature activated to allow point inputs on the form. At the moment the user has to click on the pen icon (top right) within the map to place down a marker. Ideally I would want it to be automatically in the 'place pin' mode, but baby steps first...
There is a website that I have seen that does it quite elegantly... http://www.daft.ie/ad-entry/sharing?ad-level=standard&action=create-ad (register with a free account and click on the free ad to see the map input form) That's the kind-of functionality i'm trying to achieve with openlayers... but i'm a long way off :)

Submitted by matus (not verified) on

With your tutorial and the video, I was adding location within minutes ... great job !!!!

Pages

Add new comment

Plain text

  • No HTML tags allowed.
  • Web page addresses and e-mail addresses turn into links automatically.
  • Lines and paragraphs break automatically.
CAPTCHA
This question is for testing whether you are a human visitor and to prevent automated spam submissions.

Recent Tweets

  • New post: Posting location co-ordinates to a drupal service - Part 2 http://t.co/MQhlVKBNKC 1 year 3 months ago
  • New post: Posting location co-ordinates to a drupal service - Part 1 http://t.co/2xlYgqFaJ0 1 year 3 months ago
  • New post: Connecting a drupal service with a mobile application - Part 2 http://t.co/01cFtAunDs 1 year 3 months ago
  • New post: Using drupal services to connect to mobile applications - Part 1 http://t.co/VEURftHCef 1 year 3 months ago
  • New post: Creating Drupal 7 video gallery http://t.co/HvpKU7uT 1 year 5 months ago