Andrew Trench notes from the revolution

18Feb/10Off

TUTORIAL: How to create an interactive map for your readers – for dummies like me

Geo-location, crowdsourcing, collaborative journalism... these are some of the buzz words of our business right now and it's quite an adventure getting your head into all of these trends and finding ways to apply them in every day journalism.
One of the most obviously useful applications is to create an interactive map where your readers can contribute information which has a geographic context. Say you wanted to map potholes in your community, or have a tool to report broken street lights and so on? This would be very useful.
Google Maps provides some powerful technology for online mapping and it's really easy to whip up a map illustrating a series of stories or an unfolding trend, but, unless you are a programmer, it can be a heck of a lot more difficult to create a map that your users can help build. The Google Map API is incredibly powerful but if, like me, you are not a programmer's bottom, you need to find other ways as a journalist to get things moving.
Over at the Dispatch where I am editor we have been running a campaign over uncollected garbage in our city which has reached crisis proportions.
So one morning recently I decided it would be useful to build a map that our users could use to report uncollected rubbish.
Using Google Docs', a couple of spreadsheets and its a Google Map gadget, I was able to build what you can see below. To see the page on our site with the map and user submission form, click here

I'd now like to share a detailed description on how to do this for yourself. This is for the non-techies like me, journalists who want to be able to build something for a specific application on the fly. It's not perfect (users can't delete map points, for example and it would be great if users could upload pics too but that's a bit beyond my ken at the moment).

However, you can see how useful this map has been in the few days we have had it up and running. It has quickly provided us with a view of rubbish collection problems and some places to visit and monitor as a newspaper.

STEP 1

Create an account at Google Docs. This is simple to do if you already have a google account so if you don't have a google account, register for one.

STEP 2

Create a new form, using the "Create Newt" option on the Google Docs page.

STEP 3

In the Form page create a simple form using the easy wizard. Create text input boxes for Street Number, Street, Suburb, City, Country.  Make all of these form fields, compulsory for your users. You can also provide an option Comment field so that they can have their say about what every they are mapping.  Save the form.
Then at the bottom of the form screen you will see a link to the form you have just created. Open that link in a new window. We will enter a couple of test items using it now.

STEP 4

Complete the form a couple of times to generate some test data. Use the "back to form " link to recomplete it a couple of times. 

STEP 5

Now click the "See responses" drop down and choose the Spreadsheet option. This will take you to the spreadsheet which is linked to the Form you created and which will collect the input from your readers. You will see a spreadsheet that has column headers linked to the form questions you prepared.

STEP 5

As readers complete a form their details will appear in these columns. But to be able to map this address properly it needs to be combined into a single address line which can be passed through a geo-coding service.
Luckily this is easy to do in Google Spreadsheet using an arrayformula.
So give column F a header like Complete Address and enter the following formula in Cell F2
=ArrayFormula( B2:B & "," & C2:C & "," & D2:D)
If you have extra fields for address information in this information in your form you will need to adjust your arrayformula to include those fields.
What this does is that everytime a user enters details into a form, column F will combine that information into a useful address line.
Once you've entered that into F2, you should see something like this:

Try and enter a new record using your form. Did it work? Great. Almost there

STEP 6

Create a new worksheet by selecting this option at the bottom of your current worksheet.

Select the new sheet and from the Insert menu select Insert Gadget.

You now have the option link your map to the address field created by the arrayformula.

In the Range field input Sheet1!F2:F50
Which will select all the addresses in sheet1's F column where your combined addresses reside plus a few more (up to 50 at this point).
As your user input grows in your sheet you may have to come back to this and make the range bigger to ensure that all new points are picked up. I'm still trying to figure out an automatic way to ensure the range grows as your data grows (any tips anyone?). But it is an effective workaround making the range greater than the existing rows of data when you start.
Give the map a title and select any other option you may want. Click "apply and close"

STEP 7

You now have a map. You should see something like this:

Now it's time to put this all together on your site. Luckily Google make this really easy. In the top right of your Map Gadget there is a little drop down menu. Select it and choose publish. You will see a warning that all documents linked to it will need to be published and that's okay. After a moment you will be given a screen with embed code for your map. Grab it.

You can now paste this into your blog or any webpage which will produce what you see below:

Now if you go over to your form. Choose the Form menu and select "embed form in a webpage" and you will be given some more embed code. Which you can use thus:

Put these together on a page and you have a simple but effective way of your readers being able to provide you with data which will be dynamically mapped. The map will update as they enter data (or within a few minutes) and as long as the cell range you defined in your gadget in step 6 captures all new entries it should continue to do so.

I hope this is useful to other journalists like me. And if anyone has any further advice on how to use this technique or can suggest other methods, I'm all ears.

About Andrew

No description. Please complete your profile.
Comments (1) Trackbacks (0)
  1. Dispatch is leading the way and has much to contribute to showing the way. May I suggest a new category on your blog. Tutorials from the Trench?


Leave a comment


Trackbacks are disabled.

5 visitors online now
5 guests, 0 members
Max visitors today: 5 at 10:33 am SAST
This month: 8 at 09-01-2010 05:53 pm SAST
This year: 38 at 05-02-2010 12:10 pm SAST
All time: 38 at 05-02-2010 12:10 pm SAST

Compression Plugin created by - Sponsored by Waverly Bedding.