1. About storymaps


This module introduces storymaps, and why you might want to make one.

Estimated time: 10 mins


What is a storymap?

A storymap or story map is an interactive online exhibit which tells a story or explains an idea using an annotated map.1Tony Hirst, ‘Seven Ways to Create a Storymap’, School Of Data (blog), 25 August 2014, http://schoolofdata.org/2014/08/25/seven-ways-to-create-a-storymap/.

A number of open source storymap tools are available, including StoryMapJS (used in this tutorial), TimeMapper and Odyssey.js.

Historians can use a storymap in many different ways, including to:

  • Describe a journey
  • Track a story across a map
  • Compare multiple locations

A storymap includes both a map and some annotations. The map shows you where and the annotations tell you what. Together, the map and the annotations – the where and the what – tell a story.


About StoryMapJS

StoryMapJS displays maps and annotations side-by-side (some tools are different).

A storymap in StoryMapJS – a StoryMap – has two components: a map and a set of slides. The map is visible at all times, and one slide at a time is displayed next to it. Each slide is linked to a particular location on the map, and the map pans automatically to focus on that location.

Your StoryMap can be navigated in two ways:

  • linear: following the sequence of the slides;
  • non-linear: selecting a reference marker on the map brings up the associated slide.

The combination of linear and non-linear 2On linear and non-linear visualisations, see Alan Liu, ‘When Was Linearity?: The Meaning of Graphics in the Digital Age’, Digital History Project, August 2008, http://digitalhistory.unl.edu/essays/liuessay.php. navigation makes a StoryMap interesting for visitors. Take this StoryMap on the westward expansion of the US. A visitor can follow the sequence of slides to track this change over time (linear navigation), and s/he can also use the map to click on locations of interest (non-linear navigation). The visitor does not have to choose between the two approaches, and can switch between them at any time.


The next module will cover how to make a simple StoryMap.

Next

References   [ + ]

1. Tony Hirst, ‘Seven Ways to Create a Storymap’, School Of Data (blog), 25 August 2014, http://schoolofdata.org/2014/08/25/seven-ways-to-create-a-storymap/.
2. On linear and non-linear visualisations, see Alan Liu, ‘When Was Linearity?: The Meaning of Graphics in the Digital Age’, Digital History Project, August 2008, http://digitalhistory.unl.edu/essays/liuessay.php.
css.php