Building a Story Map

Earlier today I explained how I believe that one next big trend in online mapping will be Narrative or Story maps. Applications that move beyond being merely mapped visualizations of data but also attempt to tell the underlying stories behind the data.

Over the last few years we have seen some great mapped visualizations, maps that allow users to explore data by location. We are now also beginning to see some great maps that rely on narrative to explain important stories. Two very good recent examples of this are the Jamaican Slave Revolt Map and Hussain's Journey.


Last week Vizzuality received a $35,000 grant from the Knight Foundation to build an open source tool to help developers create just these kinds of Story Maps. Vizzuality already have the beginnings of this tool in place. You can view the progress so far on the Odyssey.js GitHub page. 

The Odyssey tool is being designed to help developers combine narratives with maps to create compelling stories. If you have a look at the quick start example map on GitHub you can see that the current version of Odyssey includes two main elements, a map and a scrollable narrative element. When the user scrolls down on the page triggers in the narrative element fire actions on the map. The result is that as the user progresses through the story the map automatically updates to illustrate the narrative.

This is very similar to the approach I took in this narrative map about the Mary Celeste that I put together with the help of jQuery Waypoints and the Google Maps API. One day I might get around to creating my own Story Map library using this Mary Celeste map as a template. Until then anyone is free to use the code from the map to tell their own mapped stories with the Google Maps API.