An interactive timelapse of Earth’s supercontinents and evolutionary history

The master branch does not include the required raster maps, created by Christopher Scotese. The production branch includes the map files and a local copy of the country borders TopoJSON data.

Alternatively, you can grab the maps from the original source:

1. Download the maps from EarthByte
2. Rename the map filenames to correspond to the list in map-dates.json
3. Create high- and low-res versions and place them in the /assets/map-textures/hi-res/ and /assets/map-textures/lo-res/ folders

The production branch also includes local copies of the external js libraries so the code can run entirely offline. To recreate the bundled vendor code file, install the npm dependencies and run npm run rollup. For convenience, npm run server will start a basic HTTP server on port 8080 with cache disabled.

• /assets/data/map-dates.json: filenames for the texture maps and what year they correspond to
• /assets/data/craton-label-positions.json: coordinates for craton labels for each map

• /assets/data/craton-shapes.json: craton shapes in TopoJSON format
• /assets/data/craton-hints.json: data about how modern country borders should be displayed over the cratons (list of countries to include, circular boundary to clip countries at, and any Euler rotations necessary to countries)
• /assets/data/craton-rotations.json: Euler rotation values for each craton and where to center the globe by default at each snapshot in time

• /assets/data/supercontinent-positions.json: labels for supercontinents (when they should appear, and their positions at each snapshot in time)

Maps:

• Raster maps (750 mya to present): Scotese (2016)
• Rodinia: recreated based on Euler rotations by Evans, D.A.D. (2021)
• Nuna: recreated based on Euler rotations by Elming, S.-Å., Salminen, J., & Pesonen, L.J. (2021)
• Current day country borders: World Atlas TopoJSON

Fonts used:

• Computer Modern (OFL) by Donald Knuth
• Philibert (OFL) by Open Source Publishing

JS libraries:

• D3
• svg-round-corners
• WebGL globe texture mapping based on Mars on a WebGL globe