Note: I've intentionally not shared the cached data pulled from Marvel Developer, only the directed graph data to build this visualization. Part 9 — web page and graph visualization; Follow the duo on Twitter to see what’s coming: @mkheck and @jmhreif; Download Neo4j; Spring Data Neo4j docs; Spring Data Neo4j Guide; Marvel … The peak appeared between 1989 to 1995, and the highest number of first appearance in a given year was 1993 which reached 554 characters. Based on these feedbacks, we made changes accordingly. We also think it would be really interesting to look deeper into the development of Marvel, its ups and downs, its competition with DC, its relationships with Disney and Fox, and from there, maybe we can see if those factors have made impact on the characters(number of new character, their gender, race, and abilities) they created through the years. If we can see something, we internalize it quickly. (Photo by Gerald Martineau/The Washington Post via Getty Images), Written by Wen Chen, Pei Liang and Xingya Wang. The subject of our datasets are different: two feature on the superheroes in Marvel Universe, one features on all the characters including superheroes, supervillains and those who stay neutral. Heroes will be listed in italics.. 1 1939. Winner - Best individual 2017 Information is Beautiful Awards. UNKNOWN LOCATION, DC – FEBRUARY 17: Marvel Comics Publisher, Stan Lee, poses with a book of “Spider Man” comics which he created along with comics on the “Hulk” and others. 2017. Fast-Food vs. Vegetarian + Vegan Food Options In the US. At the meantime, the X-Men are more connected within their own group. Now were ready to build our nodes and links. From the final visualization, we can see that Captain America is the most centralized superhero in the Marvel Universe followed by Spiderman and Iron Man. Based on the study of the superheroes networking. What we did is to expand the size of the graph, further spread out the nodes, make the nodes bigger, and to use the “non overlap” function to avoid overlapping. Commented on kernel Marvel Universe Data Analysis & Visualization. Scroll down and right and hover. Sep 25, 2019 - Explore Liz Schwartz's board "Data Visualization", followed by 550 people on Pinterest. Summary. During the class discussion, we’ve received a lot of questions and suggestions and we’ve found them very valuable. We do a quick count on how many relationships each avengers have and how many comic books they appeared in, Building a grouped bar chart in Plotly is very simple. Playing is the most natural way to learn. But through this project, we’ve learned about this and people can see it on the poster, that the Sub-Mariner stands among Avengers. In Marvel Universe, the number of male character is 3 times bigger than female character, and 0.5% of the characters are agender. We’ve found in the year of 1993, more characters than ever made their first appearance, but we didn’t explain why. Also, to make the centred characters more stand out and easier to be visually perceived, we decided to get rid out all the hero’s name labels, and use their profile pictures instead. Neil Gaiman, Alan Moore, Warren Ellis, and Art Spiegelman are among my favorite authors now, but when I was younger, I was a big fan of Marvel superheroes. We utilized Openfire to clean the huge dataset, and only left the information of Marvel Universe. Data visualization is another form of visual art that grabs our interest and keeps our eyes on the message. The movies are all based on characters that appear in American comic books published by Marvel comics. Marvel Cinematic Data Visualization With Plot.ly I’m a huge sucker for Marvel cinematic and in this article I will do a fun exercise with building a simple interactive 3D network graph based on the relationship between Marvel characters. But, with the popularity of Marvel movies, it would interest a large part of the general populace as well. The scores for all superheroes were voted by Marvel fans. #heros[heros['hero1'].str.contains('DAREDEVIL')]['hero1'].unique(), https://www.kaggle.com/csanhueza/the-marvel-universe-social-network, « Dimension Reduction with Principal Component Analysis. Layout function helps us define the layout of the network graph, what we are doing here is populating our X, Y, Z coordinates for each node and edge to be placed into our 3D space, Same as how we built the bar chart, we define our data & layout and pass into the Figure function. We can quickly identify red from blue, square from circle. The package rvest makes it very easy. North American Digital Media Awards. It’s not difficult to tell that superheroes in the Avengers group have more interactions with other superheroes, because the purple edges permeate the graph. Explore and run machine learning code with Kaggle Notebooks | Using data from multiple data sources Visualization from Xingya’s last Marvel networking project. It is not affiliated with Marvel Entertainment, LLC and is an unofficial community operated by dedicated fans. The provided Ruby script takes the data provided by Joe Miro, Cesc Rosselló, Ricardo Alberich and the Marvel Chronology Project and formats it for use with a JIT Force-Directed Graph . The scores for all superheroes were voted by Marvel fans. All together, we’ve seen each of Iron Man, Thing and Vision’s name twice, so we think they might be considered the most powerful superheroes according to the fans. Fantastic, Scarlet Witch and Vision; the toughest(durability) ones are Wolverine and Thing; the fastest one is Vision; the strongest ones are Iron Man and Thing. See all awards and nominations. In this part of the visualization, first, we used Excel to manage the dataset with xlsx format. It includes their fan-given scores on their abilities (intelligence, strength, speed, durality, combat). See more ideas about Data visualization, Visualisation, Infographic. Browse our infographic to learn how to tackle the 23 Marvel movies released so far and dive deep into the box office numbers for the Marvel blockbusters. However, it was a little bit challenging to see the main characters in the original graph, because both the node size and the text are small and clustered. The percentages of good and bad alignments of male characters are 30% and 55% respectfully, and these percentages for female characters are 49% and 30%. Marvel Cinematic Universe as a 3-D network Network Visualization / comics , fiction , Marvel The Straits Times visualized the Marvel Cinematic Universe with a 3-D browsable network.… Now you can watch the Marvel Cinematic Universe in chronological viewing order. Information is Beautiful Awards. May 18, 2012 - Every Single Avenger That Marvel Ever Invented. I will be using one of my favourite plotting libraries in Python, Plot.ly. Photo from Washington Post Archive scanned on 2/17/2009. Thankfully, Wikipedia already lists the movie data for us. The trend of year of Marvel characters’ first appearance had hit the bottom during 1950 to 1960. In this personal project I developed an interactive visualization tool for the visualization of comic characters from Marvel and DC. 1.1.1 Here Is The Sub-Mariner! Visual Learning Learning Centers Annual Report Design Makeup Store Dashboard Design Cardcaptor Sakura Japanese Artists Data Science Data Visualization This part looks a little intimidating and complicated but its not so bad. Area and trend chart of “Year of First Appearance”. We applied similar or identical colors in different graphs on different topic to make the poster visually consistent, however it can be misleading. For the superhero networking graph, we decided to go on with the work that Xingya had done for the Gephi lab. Amanda did a lot of research on how we could interpret the characters demographic data in a refreshing and interesting way; Xingya learned to use Adobe Photoshop and Illustrator to put the profile pictures on the graph and make the legend; Pei collected and created the whole superhero ability dataset all by herself. If you’re looking for uniquely crafted & beautiful visualizations of data — let’s get in touch! It has a beautiful circular layout and viewers can recognize different superhero groups and their relations by different colors. The correlation coefficient for budget vs review rating was found to be 0.67. Therefore, we created two pie charts, two bar charts as well as one area and line chart. We start off with links by putting our (source, destination) for every node into Edges and pass Edges into our igraph. Use Case. Originally, there are over 30,000 records in the dataset which including 12 criterias and also included DC and other universes’ data. Visualization by: Pew Research Center Learn more: Next America . We really liked the flattened affect that illustration images have provided, so we used some of their superhero profile pictures on our graph and found more similar images from the internet. See the Visualization: Marvel Social Network Graph . Before, we didn’t even know the existence of, for example, the Sub-Mariner, let alone the fact that he serves closely to Avengers and Fantastic Four. This data visualization is a beautiful attempt to put the series of movie plots in a timeline arrangement. Link to the full page of the source article. It includes their fan-given scores on their abilities (intelligence, strength, speed, durality, combat). Adobe Illustrator: Served as the tool for adding profile illustrated pictures on our networking graph. Best Data Visualization. In terms of the powergrid, we compared “Intelligence”, ”Combat”, “Speed”, “Durability” and “Strength”. The challenge was to get it scraped. Knitting And Crochet. Our eyes are drawn to colors and patterns. We choose this Marvel Universe visualization as our group’s final project in honor of Stan Lee. This idea was inspired by an interactive map called Marvel Cinematic Universe we found on The Straits Times. It’s storytelling with a purpos… Visualizing Marvel characters and related information would most definitely interest comic book fans. In the first iteration, we compared top 20 most connected superheroes’ powergrid. Marvel Cinematic Universe from The Straits Times. From these two pie charts we can see that more characters in Marvel Universe kept their identity in secret rather than reveal it to the public. This interactive data visualization was installed at the Gallery of Modern Art (GOMA) in Brisbane as a feature display during the Marvel Cinematic Universe exhibition that attracted record crowds from May 26 to September 3 … Probably, the reason caused this spike is the publishing of the new series of Uncanny X-Man, X-Man Unlimited as well as X-Men 2099. We collected the ability information for 20 most connected superheroes, but it’s too clustered and difficult to read considering the space allowed on the poster. 1.1 Motion Picture Funnies Weekly Vol 1 1. Saved from tulpinspiration.tumblr.com. We selected the top 20 most connected superheroes as subjects. Commented on kernel Marvel Universe Data Analysis & Visualization. For more information on installation, visit http://igraph.org/python/, One of the requirement to build this network graph is to express the source and destination nodes as integer values. But each of all took on other tasks too, which might not necessarily be what we are good at or familiar with. SHDb has data of side-by-side power comparison for all superheroes. This dataset provides information for characters regardless of their alignment. Play around with some of these to see the different structures. Visualization of the Social characteristics of the Marvel Universe using the Javascript Infovis Toolkit (JIT). Fabric Crafts. Get the Marvel and DC comic movies data. From the (revised)chart, among the 10 most connected superheroes, we can see that the the best fighter are Captain America (we’re not surprised) and Wolverine; the smartest ones are Iron Man, Mr. Marvel Universe was created by Stan Lee, the most influential comic icon, with several artists in 1961. . This trend is confirmed by the second highest-rated movie Avengers: Infinity War (2018), which is also the MCU movie with the second highest budget. The hero-network.csv dataset contains two columns, hero1 and hero2 and represents a connection between the two characters. Explore. In a larger sense, we believe I have achieved this goal. DIY And Crafts. What we did is to expand the size of the graph, further spread out the nodes, make the nodes bigger, and to use the “non overlap” function to avoid overlapping. The Marvel team thinks they’ve built a solution: a massive database that uses graph theory to give fans a simple take on characters that span comics, movies, and video games. The major superhero groups are Avengers, marked in purple, featured by Captain America, Iron Man etc; the Spiderman’s group, marked in pink, featured by Spiderman and Daredevil; the X-Men group, marked in blue featured by Wolverine, Professor X, the Beast, etc; the Fantastic Four group, marked in orange, featured by the Thing, Human Torch, etc; Thor’s group, marked in light blue; Doctor Strange’s group, marked in apricot; the Sub-Mariner group, marked in yellow as well as the New Warriors group, marked in grey. However, the feedback from users said the visualization turned out to be too much bars thus not visually clear enough, so we decided to narrow the database down to 10 top superheroes. Adobe Photoshop: Used for Improving our visualization results and making the poster. Jan 10, 2014 - The business of heroes needs saving from the crushing weight of its own data. There seems to be a clear positive correlation between budget and the rating left by the reviewers for the MCU movies. Some quick data cleaning to remove empty spaces, If you are playing around with the same code and want to explore additional characters, you can use the following line to explore what type of characters are included in the dataset. Since the beginning of the 21th century, the trend decreased again. Also, to make the centred characters more stand out and easier to be visually perceived, we decided to get rid out all the hero’s name labels, and use their profile pictures instead. It consisting of thousands of separate universes and all the stories in this “multiverse” happened on Earth. When Avengers assemble, along with characters from far-flung corners of the Marvel universe, you’ll need this cosmic interactive graphic to tell who’s fighting whom, who has a hellish sister, and more. Who would be interested in understanding this data better? Avengers: Endgame (2019) had a budget of 356 million US dollars and got the highest rating of 8.8 among all the Marvel movies. ... Get data visualization tips every week: New features, special offers, and exciting news about the world of data visualization. The dataset include information about the character’s name, identity(secret/public), alignment, eye color, hair color, gender, status(living/deceased), appearances, first appearance, universe. 4 months ago. 4 months ago. Taha07. Meanwhile, we narrowed down to just Name, Identity, Alignment, Gender, and Year of first appearance these 5 criterias and 16,377 records. We divided the poster into to sections based on the subject of their datasets. There are other options like, gfr, grid_fr, grid_fruchterman_reingold: grid-based Fruchterman-Reingold layout, kk_3d, kk3d, kamada_kawai_3d: 3D Kamada-Kawai layout. For a data set with multiple information, a personalized visualization that group different visualization metaphors is necessary. We can see from the chart that the number of male supervillains are more than male heroes. However, our visualizations based on these datasets are all put together without any identifications. Ekrem Bayar. Making Data Beautiful The most inspiring new art is visualized information Aaron Koblin's New York Talk Exchange shows, in real time, the volume of telephone and Internet data flowing to other cities. https://drive.google.com/open?id=1ZgD-KGWe8WRDPCuhGMuREg0T7ltv5QpH. Link colors represent type of relationship, and proximity naturally represents commonalities between characters. Plot.ly is very easy to use and the way graphs are constructed is very intuitive. Also, there’s a lot of purple in on the winner list of each ability, which means that the Avengers has gotten a great team! https://www.tor.com/2015/07/20/the-marvel-cinematic-universe-has-more-than-enough-characters-for-captain-america-civil-war/comment-page-1/, https://public.tableau.com/views/MarvelCinematicUniverse_0/MCU?:embed=y&:display_count=yes&:toolbar=no:showVizHome=no. However, it was a little bit challenging to see the main characters in the original graph, because both the node size and the text are small and clustered. After data cleaning process, we visualized the statistics with Tableau. We collected the raw data from https://www.superherodb.com/characters/. This page contains every death from every comic book from the Marvel universe in order of release date. The Marvel Cinematic Universe is gigantic, and with the box office success of its previous films and TV shows, the Marvel franchise is still expanding. The 25 Best Data Visualizations of 2019 Get inspired with this ultimate list of the best data visualizations of 2019. Directly link to the original source article of the visualization. We selected the most representative characters from each superhero groups, found their profile picture on the internet, and used Adobe Photoshop to put them on each nodes that they belonged to. This visualization used consistent and uniformed blue color scheme combine with relationship networking and bar charts with different styles that gave as many valuable inspirations for our whole project and final poster. Based on the study of the superheroes networking. This is the timeline history of all movies from Marvel Comics brand versus DC Comics brand starting 1989 to 2019. So we start off with encoding our heros into numbers. Quite different with the other two datasets in the project, this dataset covered the information of  both superheroes and villains in the Marvel Universe. It has a beautiful circular layout and viewers can recognize different superhero groups and their relations by different colors. Pew’s The Next US takes a comprehensive look at demographic data in the United States and brings it all together into a massive, interactive, beautiful data visualization project with several “chapters” of … Marvel Universe is a fictional universe which based on the American comic stories published by Marvel Entertainment. Lastly we pass data and layout into Plot.ly’s figure function to build the graph. Drops Design Inspired .. We also applied another set of palettes to different superhero groups to make it more visually pleasant. Personal Project | 2019. We wanted to give a general outlook of the superhero’s network in the sense of who usually hang out together or who is the “it” superhero, and we wanted it to be visually aesthetic, so we decided to keep using the Yifan layout. The following analysis is an exploration of a dataset related to movie releases between the years 1986-2016. We clearly understand the importance of appropriate usage of technology in offshore business process management. Our culture is visual, including everything from art and advertisements to TV and movies. We really liked the flattened affect that illustration images have provided, so we used some of their superhero profile pictures on our graph and found more similar images from the internet. You just need to find the right element. If you made the visualization yourself, tag it as [OC] [OC] posts must state the data source and tool(s) used in the first top-level comment on their submission. In Chrome, you right click on the table and select Inspect. We selected the most representative characters from each superhero groups, found their profile picture on the internet, and used Adobe Photoshop to put them on each nodes that they belonged to. This could be a very huge project in the context of various social movements, like gender and race equality. From the chart we can perceive that compare with good characters, the bad people are more likely to keep their villain identity in secret. When I was designing the visualization for the comics data, comparing two galaxies using suns and planets was the first thing that came to mind. Marvel Universe was created by Stan Lee, the most influential comic icon, with several artists in 1961. Original source article doesn't mean the original source image. Or we can make a chart about the the number of new characters that DC has created during the years, together with the chart we have now, and see if there’s any associations with the success of their company development. Data Capture. We learned a lot more characters and their relations. From Raw Data to Visualization: Marvel Social Graph Analysis May 19, 2015 Use Cases & Projects Pierre Gutierrez I've been reading comics since I was a little kid. We reduced the superhero ability charts from 20 rows to 10 rows. We selected the top 20 most connected superheroes as subjects. Next I’d like to seperate our good guys from the bad guys visually, so let’s group them up. Villains will be listed in bold.. ; 1.1.2 Kar … Network Visualization / comics, fiction, Marvel The Straits Times visualized the Marvel Cinematic Universe with a 3-D browsable network. The m dimension values of a record are mapped to m pixels at the corresponding positions in the windows These are the artifacts in my sandbox playground. And then we built our own database referred by information collected on the SHDb (. ) Commented on kernel Marvel Universe Data Analysis & Visualization. We looked into Marvel in 1993 and tried to explain that why more characters were created in that specific year. One weird data point here is Thor who in my mind is should be quite popular… This might be because there are several Thor characters in the dataset, representing different Thors from different universes, as well as the comic book universe being different from cinematics. This dataset is about ten superheroes that have the most nodes from the networking dataset. At the same time, There are more supervillains than superheroes, and there are still 16.5% of characters didn’t pick up a side. Amanda is skillful with Tableau, Xingya has explored more about Gephi, and Pei is the expert when it comes to the visual design. We can see our fellow Captain Steve Rogers is quite popular along with friendly neighborhood Spiderman and Mr. Tony Stark. Based on Mike Bostock's Les Misérables co-occurrence matrix diagram. We want to pay our respect to this leading superhero behind all of the marvel superheroes and his comic legend. For each super power, we pulled out the winners and show their profile illustrations besides the graph, so that users can easily notice the winners. Marvel & DC Visualization. Instead of bar chart, we are using Scatter3d for our data, Copyright © 2019 The Art of Marketing Science. The layout function here defines the overall structure of our network graph and we use ‘sphere’. There are only 2 new characters were created in 1958. This workbook visualized the box office data for the superhero movies that produced by Marvel Studio. Our purpose is to make our visualization more versatile. Data science in marketing with practical examples, I’m a huge sucker for Marvel cinematic and in this article I will do a fun exercise with building a simple interactive 3D network graph based on the relationship between Marvel characters. And then we built our own database referred by information collected on the SHDb (https://www.superherodb.com/battle/) SHDb has data of side-by-side power comparison for all superheroes. Gephi 0.9.2: Created network and graph data. For this exercise, I’m interested in looking at the connection between some of the marvel characters and villains that we’ve see in theatres! When we see a chart, we quickly see trends and outliers. The Marvel Cinematic Universe Interactive Data Visualisation Tool Exploring Categories and Connections Between Marvel Films, Characters, Artefacts and Attributes.. View in a new tab or click to view live version. Data visualization : [OC] Captain Marvel took $455 Million in its opening weekend, the second most of any MCU movie [OC] Captain Marvel took $455 Million in its opening weekend, the second most of So it could be confusing for viewers to read. One section is graphs about Marvel superheroes, the other one is graphs about all characters, regardless of their alignments. We applied different colors to avoid color-overlapping among graphs on different topics. We collected the raw data from. However, the number of female character is just reverse. Stan Lee is one of the foundational architects of the superhero comics landscape, and he passed away on November 12, 2018 at the age of 95. This dataset only provides connections among the superheroes in Marvel Universe, villains are not included. Using data pulled from the Marvel Database API, I focused on all the different Marvel characters featured in issues by artist Adam Kubert. For the color scheme, we used red, blue and white to represent the spirit of America, just like what the Marvel Universe want to express in their comics.At the end, we used Adobe Photoshop made the title, inserted more numbers into one graph, also made the graphs more coordinate. We found this visualization online, despite the fact that it focuses on much fewer characters that we have, we still like the entertaining and straightforward style it has, concerning the pop-culture nature it is. This idea was inspired by an interactive map called. Group work really is important because we can contribute what we do the best into this project. To make the graph more comprehensible, we also made a legend so people could easily understand what the different colors stand for. Started from our previous Marvel networking project, what we really wanted to improve is to make the graph easier to read and to make the characters more standout. We practice industry standard double-pass data capture methodology to guarantee over 99.95% accuracy. Stan Lee is one of the foundational architects of the superhero comics landscape, and he passed away on November 12, 2018 at the age of 95. Each set of bar is treated as seperate data, we define the x and y values and the aesthetics for each group of bars. At the same time, more good superheroes choose to neither keep their identity in secret nor reveal it to the public than the supervillains. Openfine: Used to clean and transform large sets of data. The dataset can be found on my GitHub or at the following link: https://www.kaggle.com/csanhueza/the-marvel-universe-social-network, Key thing to remember with Plot.ly is if you want to build graphs locally on you computer using Jupyter notebooks, you need to initiate offline notebook mode. Gold in Unusual. First off, there are a whole lot of characters in our dataset, lets just keep our avengers and villains, Next we use the igraph libary which is a library for high-performance graph generation and analysis. Our goal for this project is to expand our knowledge beyond the cinematic Marvel universe and develop a new perspective for the comic Marvel universe. Then we define the layout like axes, chart title etc. This dataset is about ten superheroes that have the most nodes from the networking dataset. If we had more time, we would like to make graphs on, for instance, gender, and see how many new characters in each gender have made debut through the years, and see if it has any associations with any social movements. Tableau: Utilized as the tool for visualizing the bulk data and creating dashboard. For examples, the superhero intelligence chart was applied the same purple that marked the Avengers in the networking graph, so viewers would tend to associate this chart with the Avengers, when the avengers are in fact not relative at all. r/Marvel This is a subreddit dedicated to Marvel Comics, its publications and hundreds of characters. It’s been really enjoyable for our group doing this project and we are really satisfied with our final poster. We wanted to give a general outlook of the superhero’s network in the sense of who usually hang out together or who is the “it” superhero, and we wanted it to be visually aesthetic, so we decided to keep using the Yifan layout. We filtered out only the Marvel characters. Excel: Helped us collecting the dataset with xlsx and csv formats. We arranged the bar charts by comparison of gender and alignment, and identity and alignment, in order to make our visualization more interesting and insightful. We choose this Marvel Universe visualization as our group’s final project in honor of Stan Lee. My network visualization in Gephi provides insights into the body of work over Adam’s career at Marvel. 4 months ago. Data visualization : Marvel vs DC films visual analysis Marvel vs DC films visual analysis By aerozhx At infographic.tv we provide handpicked collection of the best infographics and data charts from around the …