Animated Race Maps

Back in 2013 the New York Times created an impressive animated mapped visualization of the America's Cup Finale between the USA and New Zealand. The America’s Cup Finale: Oracle’s Path to Victory showed the progress of the race between the two yachts from start to finish.

The America's Cup 2013 Finale: An Animated Map is a lovingly created and accurate reproduction of the NYT's map using Leaflet.js. The map allows you to replay the whole finale between the two sailing teams. The map even includes the wind speed and wind direction for the whole race.

If you like this animated map visualization and are interested in creating a similar animated race map then you can view the entire America's Cup project on GitHub.


Over 35,000 people competed in last year's Berlin Marathon. You can see how every one of those competitors fared in an animated map of the race, created by the Berliner Morgenpost.

The Berlin Marathon 2016 map animates every single runner in the Berlin Marathon on top of a map of the race's route. As the animation plays out you can watch all 35,827 of the athletes as they complete the course.

The animated map of the Berlin Marathon 2016 was created using the PixiJS HTML5 engine.

If you are interested in mapped visualizations of sports then you might also like The New Age of Sports Visualization.