Development Seed Blog

Pandemic Preparedness: When Data Visualization and Workflow Matter

Mapping on-the-ground public health organizations' capacity to respond to outbreaks

Mapping on-the-ground public health organizations' capacity to respond to outbreaks

We just finished working on the Pandemic Preparedness Capacity Project, a new tool for InterAction and USAID that will be used to help prevent the spread of catastrophic disease outbreaks, especially bird flu. The goal of the site is to both improve both data collection from public health organizations on the ground and improve data visualization for policy makers here in Washington, D.C. We built this dynamic mapping portal on all open source software: the content management system is Drupal and the mapping stack is running on Mapnik, a C++/Python GIS toolkit.

We had a lot of fun working directly with Elizabeth Bellardo at InterAction, along with several other members on her team, to develop a strategy for making data collection, site administration and data presentation all incredibly simple. In addition to the strategy, we also did the site architecture, design, and development (of both Drupal and Mapnik). I want to use this post to show some of the behind-the-scenes details that are only available to the site administrators and the NGOs using the site.

First, we needed a effective way to show the great data InterAction is collecting in almost real time to decision makers here in D.C. As you can see, the main page is showing density points based on the number of projects geo-tagged for each country. All projects are classified by specific sectors that help to describe their projects. This classification allows us to do dynamic filtering directly on the map.

If you click on a point, you are taken to a drilled-down country view showing geo-tagged projects. You can see that the map shows geographical detail down to the provincial level.

Clicking on one of these points, you can then see information about projects in a particular province or town. Here we are using Google Charts to help us display the coverage by sector in North Sumatra.

You can then go to each project to lean more specific information about an organization’s work. For example, here is a bio of a project run by the Academy for Educational Development.

A specific requirement for the site was to make sure that both the decision makers in Washington and the NGOs on the ground could easily take the data from the site with them off-line. We spent some good time designing a print-friendly style sheet that works well for both user groups.

Of course, the information on the site will only be as good as what NGOs add to the site. We need a simple workflow for public health organizations to easily upload data to the site. To do this, we redesigned common Drupal admin elements and turned some of the more mundane parts of administrative process – elements often over-looked in site development – into advantages to help increase data collection. Here you can see how clean and light-weight the data submission forms are, making geo-tagging easy even for non-technical users.

As soon as an NGO adds information, it is put into a queue and an administrator at InterAction is instantly notified. They can then securely log in from any computer to approve the data for display on the map.

In just two clicks, an administrator can quickly see the all recently added content that is not published and awaiting review.

Administrators can then review the content and in just one click, publish it to the live site to instantly show up on the map.

We’re really excited about how simple this process is and by InterAction’s commitment to make a simple site that would be easy on users. For websites being used to manage information among geographically dispersed teams – particularly when those teams are loosely affiliated and aren’t obligated to use a tool – it’s essential that users be able to take action quickly and without much effort. We feel like we were able to get there with this project and are excited to see how it works once it starts getting heavy use in a couple weeks.

Comments
Laying the Ground Work for Pandemic Preparedness

Great effort worth tracking. Would love to see the interaction of other NGOs and stakeholders as time goes by to reach its potential. A few observation in that direction here: http://disasterbound.org/node/47
Cheers,
Daniel

Great Idea - Interesting to See What User Take-up Is

It's an excellent idea, and your execution looks terrific. Of course, as you say, it's all going to depend on the accuracy and timeliness of data entry in the field. Do you have a sense of how NGO workers are reacting to the tool?

very nice

Nicely done. Would it be fairly straightforward using Mapnik to instead color, say a whole country (perhaps by intensity of color), rather than an arbitrary *point* in the country? I guess from a visualization perspective that may overly emphasize larger countries (for example if a country only has one relevant project but it is large, it may visually may seem to have more preparedness than a smaller country that is very dark). That said, I think that maps in general could often better represent geographic information if when a whole country is being highlighted, it isn't just a point (usually the capital) that was being visualized.

Again, nicely done.

Thanks,

-- David

RE: Very nice

I think you're right, but it would be hard to do this effectively on a small scale map. However, it would be an excellent enhancement to add at the drilled-down level.

Great work!

I'm impressed. Anything generic enough come from the project to channel back to Drupal? This is the type of thing that would be great to develop as a widget as well.

Keep up the good work!

Mapping Resources

Could you please post any resources you have that helped you with the development of the mapping side of this project.

Examples: links to tutorials, howto's, integrating with Drupal, etc. anything

Thanks for the write up. I would love to read more about the details of this setup.

Mapnik

Very cool. Can you tell us more about using Mapnik, a C++/Python GIS toolkit, with Drupal? Was it difficult? Why did you choose it over Google or Yahoo! maps?

Why Mapnik

To answer your questions in reverse order:

We had several reasons for using a more generalized and customizable mapping stack than Google / Yahoo maps.

Workflow:

Google + Yahoo maps are great, but didn't offer us the kind of streamlined workflow we wanted to provide for our users. For example, you can plot points on a Google map, but getting drill down functionality and dynamic redrawing/filtering is a bit tricky. Also, the data for this project was extremely channeled -- there's no point is allowing your user to pan and zoom over to Manhattan when there is no data to be seen there.

Customization:

Mapnik lets you use custom GIS data and mix and match them how you want. In this case, we needed country and province borders, but we didn't necessarily need every label, highway and city visible. These sorts of options aren't always exposed to you in map web services and we wanted full control.

Getting Drupal to work with Mapnik is a fairly straightforward process, but there are some interesting challenges you may run into:

Setting up Mapnik:

This can be a bit tricky -- the WMS interface to Mapnik needs some maintenance and we've done some cleanup here that needs to make its way upstream. Once you've got it up and running, you can make HTTP requests to your server with different parameters and it will serve up the corresponding map.

Drupalside modules:

There are two custom modules powering this project -- geotaxonomy that associates geo data like lat/lon and bounding boxes with location taxonomy terms, and graphite, our lightweight mapping stack that does the tricky lat/lon mercator projection work and conversion to simple CSS positioning for drawing maps. Neither of these modules are quite ready for release yet, but they're moving fast so you should see them on Drupal.org at some point in the future.

Post new comment
The content of this field is kept private and will not be shown publicly.
  • Allowed HTML tags: <a> <em> <strong> <cite> <code> <img> <p> <li> <ul> <ol>
  • Lines and paragraphs break automatically.
  • Web page addresses and e-mail addresses turn into links automatically.

More information about formatting options