This work on HBO's Game of Thrones started it all. I was curious whether I could visualize the various narrative threads woven throughout the Game of Thrones HBO series; to do that, I had to create a custom dataset with episode and scene metadata, character data, and more. I've written about this project's background, initial thoughts, early work, and subsequent work on Medium:
This is a playground for that idea and others.
Note: click on any visualization to view the live version or open it in a new tab.
The narrative chart started this project for Game of Thrones.
Scroll down and right. Hover over the map to view character journeys, episode names, and more. Note: map contains spoilers. View in a new tab or click to view live version.
Scroll down and right. Hover for a character count. Inspired by Hubble Image of Galaxy Cluster Converted Into Sound. View in a new tab or click to view live version.
In addition to the Narrative Chart visualization, I've also made two other interfaces for exploring datasets that are part of this project.
A compilation of several of the visualizations below, where data is filtered by episode. Choose an episode to explore how characters accumulate screen time, the locations shown in the episode, wordcount distributions, the opening sequence locations, and more.
Search across all dialogue spoken throughout Game of Thrones. Search for text, phrases (in quotes), characters, or languages (e.g. Dothraki or High Valyrian).
Some of the easiest things to visualize are representations of when characters are on screen and where those characters are.
Scroll down and right and hover. View in a new tab or click to view live version.
Scroll right and hover. View in a new tab or click to view live version.
Scroll down and right and hover. View in a new tab or click to view live version.
Scroll right and hover. View in a new tab or click to view live version.
Scroll right and hover to see who killed whom and how they died. View in a new tab or click to view live version.
Scroll right and hover. View in a new tab or click to view live version.
Scroll right and hover. View in a new tab or click to view live version.
Scroll right or hover over a bar. View in a new tab or click to view live version.
Scroll right or hover over a circle. Circles are color-coded by house. View in a new tab or click to view live version.
It's also fairly trivial to count how long characters are on screen (in total, by season, or per episode), how long they spend in certain locations, or the number of locations and time spent in each per episode.
Scroll down and right or hover. Based on Andrew Reid's Horizontal Stacked Bar Chart. View in a new tab or click to view live version.
Scroll down and right or hover. Based on Andrew Reid's Horizontal Stacked Bar Chart. View in a new tab or click to view live version.
Choose the character you'd like to show. Based on Harry Stevens's Linear Regression for Scatter Plot. View in a new tab or click to view live version.
Scroll down and right or hover. Based on Andrew Reid's Horizontal Stacked Bar Chart. View in a new tab or click to view live version.
Scroll down and right or hover. Based on Andrew Reid's Horizontal Stacked Bar Chart. View in a new tab or click to view live version.
Scroll down and right or hover. Based on Mike Bostock's Normalized Stacked Bar Chart. View in a new tab or click to view live version.
Hover. Based on takayuki's Treemap in d3 v4. View in a new tab or click to view live version.
Scroll down and right or hover. Based on Andrew Reid's Horizontal Stacked Bar Chart. View in a new tab or click to view live version.
Scroll down and right or hover. Based on Mike Bostock's Normalized Stacked Bar Chart. View in a new tab or click to view live version.
Scroll down and right or hover. Based on Andrew Reid's Horizontal Stacked Bar Chart. View in a new tab or click to view live version.
Scroll right or hover. Based on wpoely86's Diverging Stacked Bar Chart. View in a new tab or click to view live version.
Scroll right or hover. Based on wpoely86's Diverging Stacked Bar Chart. View in a new tab or click to view live version.
Scroll right or hover. Based on wpoely86's Diverging Stacked Bar Chart. View in a new tab or click to view live version.
Scroll down and right or hover. Based on Andrew Reid's Horizontal Stacked Bar Chart. View in a new tab or click to view live version.
Scroll down and right or hover. Based on Andrew Reid's Horizontal Stacked Bar Chart. View in a new tab or click to view live version.
Scroll down and right or hover. Based on Andrew Reid's Horizontal Stacked Bar Chart. View in a new tab or click to view live version.
Scroll right or hover. Based on wpoely86's Diverging Stacked Bar Chart. View in a new tab or click to view live version.
Scroll right or hover. Based on wpoely86's Diverging Stacked Bar Chart. View in a new tab or click to view live version.
Scroll right or hover. Based on wpoely86's Diverging Stacked Bar Chart. View in a new tab or click to view live version.
Scroll down and right or hover. Based on Andrew Reid's Horizontal Stacked Bar Chart. View in a new tab or click to view live version.
Scroll down and right or hover. Based on Andrew Reid's Horizontal Stacked Bar Chart. View in a new tab or click to view live version.
Hover. Based on Mike Bostock's Les Misérables Co-occurrence. View in a new tab or click to view live version.
Hover and drag. Based on heybignick's d3 v4 force-directed graph. View in a new tab or click to view live version.
This chord diagram looks at character co-occurrences (two characters showing up in the same scene) across the show, the same data as above, just in a different representation.
Scroll down and right and hover. Based on HenryLau's chord diagram on JSFiddle. View in a new tab or click to view live version.
Hover and drag. Parent-child (solid gray), spouse (dashed blue), and killed by (solid black arrow) relationships shown. Based on Mike Bostock's Labeled Force Layout. View in a new tab or click to view live version.
Hover and drag. Parent-child (solid gray), spouse (dashed blue), and killed by (solid black arrow) relationships shown. Based on an HBO infographic. View in a new tab or click to view live version.
Hover and drag. Based on a Cool Material infographic. View in a new tab or click to view live version.
Scroll down. Data last pulled following Season 7. View in a new tab or click to view live version.
Scroll down and right. Data last pulled following Season 7. Based on Mike Bostock's Les Misérables Co-occurrence. View in a new tab or click to view live version.
I hadn't yet done much with the list of locations shown during the opening sequence of Game of Thrones. For this, I really wanted to be able to show the places on a map of Westeros, Essos, Sothyros, and Ulthos. To do that, I built upon what others had done, but converted a .png to .svg to .geojson. More on that below.
Drag and select. Based on heybignick's d3 v4 force-directed graph. View in a new tab or click to view live version.
Select. Based on the A Song of Ice and Fire Wiki geography. View in a new tab or click to view live version.
Drag and zoom. Adapted from Jason Davies' "Rotate the World". View in a new tab or click to view live version.
Choose the episode you'd like to show. Adapted from Andrew Mollica's "World Tour along Flying Arcs". View in a new tab or click to view live version.
Choose the episode you'd like to show. Adapted from Andrew Mollica's "World Tour along Flying Arcs". View in a new tab or click to view live version.
Choose the character you'd like to show. Adapted from Andrew Mollica's "World Tour along Flying Arcs". View in a new tab or click to view live version.
I'll write more about this one in the future, but this is a scatter plot of the slope and y-intercept of the linear regression of screen time per episode (see above) for each character. I've then unscientifically grouped the characters and labeled each group.
Putting a line in the sand now: I think Tyrion will be there in the end (first of his name).
Hover and/or choose the character you'd like to show. Adapted from Harry Stevens's Linear Regression for Scatter Plot. View in a new tab or click to view live version.
The GitHub repository for this project has the data files used to make these visualizations. Code for each is also on GitHub, and a description of the project is on Medium:
Comments and suggestions are welcome on GitHub, Medium, or here.
h/t to Jason Davies for the clean style of this page.