Making Beautiful Maps With Running Data

August 28 2012 by Tom MacWright

Running maps are a fascinating corner of the mapping space. In February 2011, I worked on my first running map with a very early version of TileMill, simply overlaying scaled points representing heart rates over DC.

By July there was an improved version, which used a custom algorithm to turn running data into a multiple-width line and wrapped the map in a unique interface that displayed BPM via TileMill-generated interactivity.

Running data is really compelling for a number of reasons. Data that comes from a GPS watch, like my Garmin Forerunner 305, can have heart rate, pace, altitude, and location for each trackpoint.

An updated map (127 runs) using fast, experimental filters in Mapnik.

Common data types like GeoJSON have no way of representing this sort of data, which is why Garmin uses its semi-proprietary TCX format. GPSBabel, an open-source file converter, has been an essential tool in bridging these gaps, along with the OGR utilities.

A wiggle stereogram of run elevation, made with pre3d, node-canvas, and gifsicle.

Here these variables are visualized for a dataset of 127 runs, a custom node.js script which uses node-canvas for rasterization.

It’s also an extremely personal sort of data - the aggregate of many runs will highlight your favorite routes, like you can see on Ben Watts’s Ottawa running map.

We’re experimenting with new ways to represent runs, with animation, rotation, and sync'ed visualization. There’s much more to come.