Sunday, February 22, 2009

Google Maps in Drupal

Below are some brief instructions on how to use it:

Step 1. Create a map with macro creator

Each site includes a macro to create a map that you can customize it as you see fit. You can see the GMap Macro on my site here. To create a map:

* Scroll to the bottom of the macro to define the Map Height and Map Width. This is in pixels (try "500px" by "500px" to start with) and make sure you include the "px" after the number. Scroll back to the top and you will see the template map has automatically resized.
* Move the map around with the mouse to the area you want to include. Also adjust the zoom control to achieve the level of magnification you want. You can choose between a basic map, a Satellite map or a hybrid version by switching between the buttons.
* You can add points, lines or circles by (single) clicking on the map. You can switch between these options with the pull down menu where it says Click Map. Experiment by clicking around a map to see what happens.
* Some of the line/polygon settings are a little temperamental, but the marker options work well allowing you to change the marker type. It is possible to link one marker to another.
* To remove a marker make sure the Click Marker option is set to "remove" and then click the marker to be removed on the map.
* Each map needs a different name or identifier (set to "map" by default). Type this in to the Map id attribute field. This can only contain numbers letters and the "-" symbol, and must be unique for each map that will appear on the same page.
* The Control feature (None|Large|Small) allows you to specify whether there is a zoom control on the map and what size it is.
* There are all sorts of advanced options available for customizing your map. The most important of these is the ability to have feeds that take information from a local RSS feed with geolocation data and dynamically plot this on the map. I'll blog about this separately when I have figured out how to do it!

Step 2. Put the map on a webpage (node) in your site

Scroll down to the bottom of the macro and copy the Macro Text that appears in the text box. You then need to paste this into the body field of a new page (node). When you do this make sure to disable rich text (just underneath the text box) and under Input Format select the GMap Filter option. You can add any other information to the page with HTML or the rich text editor.Just do not change the GMap Macro text. When you are done, click Submit and the new page with your Google Map and any plotted points, lines or polygons will appear.

No comments: