Marvel Cinematic Universe
Every year, the
Graph Drawing and Network Visualization
conference organizes a contest where they provide data which needs to be visualized. In 2019, one of the creative topics
deals with the relationship between Marvel superheros and the movies in which they appear.
yWorks’ Contribution
In this visualization of the Marvel Cinematic Universe and its characters, we’ve arranged all movies according to their
in-universe timeline. Characters are shown as edges that pass through the movies they appear in. The thickness
of edges models the relative screen time of characters within a movie. The overall layout is automatically
computed based on the hierarchical layout style in yFiles.
Since the graph offers many details that could be explored, we decided to create this interactive app that
provides features like hover effects, filtering, zooming and panning.
Complete Graph
Initially, the graph shows the journey of each superhero. Hover over the colored lines or the icon in the
legend to
highlight one superhero and follow his/her path through the movies.
Filtered Views
To get a more compact view of the graph, you can either focus on the paths belonging to one superhero or
belonging to one film series.
- Click a line or an icon in the legend to only show the movies in which the selected character
appears along with the characters that also appear in these movies
- Clicking a movie will only show the movies belonging to the same film series as well as the
characters appearing in these movies
- To return to the original graph, double-click in the background.