Implementing maps in Drupal7 is not easy as it was in Drupal6 using Gmap but Gmap module is not developed for Drupal7. I was working with maps in Drupal7 and personally I felt that there are less documentation on maps in Drupal7. So, I thought to write this blog which can probably help my readers in implementation of maps. Related to implementation luckily we have Openlayers module in Drupal7.
Openlayers with maps, what sounds like the small task of showing some nodes on a map with the following collection of modules and dependencies:
- Geofield : which hold the geo coordinates in our content
- Address field: to hold postal address in our content
- Geocoder: to convert address data into geographical data
- geoPHP: Geocoder dependency
With some additional dependencies
- Views 3
Step 1: First you have to install above module and enable them included with Openlayers and its sub modules
Step 2: Create content and add following fields
- Addressfield : Postal address , zipcode , city
- Location : field_type – Geofield , Widget – Geocode from another field
Address field will store your postal address of your business and geofield will take those address in location field and fetch geo coordinates of all businesses.
Step 3: Creating a Map
Openlayers come with many configurable option. I will describe basic options which you need for creating map. We need a base layer which is our map with some additional behaviors and styles on it. Secondly, Openlayer overlay which we will setup using views later.
Getting started with creating map
Go to structures > Openlayers > maps. Click add map and fill all details. Your map details should look like below.
Configure layer & style for your map.
Configure some behavior for map.
Now we are done with creating map which we will use for displaying data on it later.
Step 4: Creating Openlayer Overlay or you can say map view.
We need two things
- Openlayer overlay to display data on map
- Page or block to display map
Go to structures > Views > add new view .
Values for view
- Show : Content
- of type : Business information
- create a page : Checked
Click on continue & edit. Here we will change some things in our view.
Add these values to your view
- Format : Map > business map > Apply(all display)
- Add Fields : 1) Title 2) Location . You should also set path of you page.
Now we will change some settings of our Openlayers overlay. Click on settings side by Format Openlayers Data Overlay | Settings.
- Map data sources > WKT
- WKT field > content : Location
- Title Field > content : Title
What just we did ?
We created our map and added overlay for our data to display on map using views.
We will add this Overlay to our map which we created earlier . Go to Structures > Openlayers > Maps > business map > layers & style . You probably see your view their in list . Just enable them so this map will use overlay for displaying content.
That’s it at this point we had a page available containing map with overlays displaying data when you hover them.
Thanks to Sonali , Anirudha , Chetan for reading draft of this.