Cosmere Maps

As a fan of Brandon Sanderson's books, it always struck me as difficult to visualize where characters are in the complex fantastical worlds he likes to set his novels in, even with the included maps. With this project I wanted to provide a fun mapping tool that allows readers to select exactly where they are in one of the Cosmere novels and see precisely where any of the primary characters are and have been at that moment.

With Leaflet's simple mapping toolbox, it was easy to stand up a interactive map that allowed me to use high quality maps of the various Cosmere books and draw various interactive items on top of those like markers or paths. I decided on using React for the app's base which allowed me to keep the various components and data sets abstracted from the end view and simply add new data as I went along. I also extended the Leaflet toolbox to allow for multiple map layers, a necessity for Sanderson's typical parallel 'realm' world structure.

While getting the map set up was great and validated my needs for the tool, I wanted to ensure it was a tool worth using as you read along and wasn't simply static and spoilery for new readers, so I fleshed out visibility selectors for books, characters, and even chapters in the most recently selected book. In addition, I made sure the map 'saved' the user's selections if they left or refreshed the app.