Visualizing and comparing the highest-grossing films

Movies cost incomes in chart
Did you see Star Wars VII? Probably yes. Star Wars: The Force Awakens is without question the highest grossing movie of all time. But do you know how it compared to Avatar?

There is no reason to let this question keep you up at night anymore:

Below you will find a few visualizations that compare various blockbusters, from both a revenue and longevity perspective.

I sourced the data for these visualizations from (a site maintained by Here one can find the daily gross income from the release date of almost every movie that hit the theaters. For example, check thislink to see the “raw” data for Avatar.

With this data in hand, how do we most effectively compare gross income between the movies? The first and safe approach would be a bar chart, but with such rich data, why make it boring? Let’s be a little more adventurous and chart each movie along a time-series, considering the cumulative gross income. (Be patient, let the data load…)

Cool or what? With this approach we can visualize the gross income (like a bar chart), but also see when the movie was released and how the highest-grossing films are distributed across time.

Did you know that E.T. and Jurassic Park have reached the same cumulative income, although they were released over a decade apart?  Now you do. I enabled the zoom in this Highcharts visualization so that you may can explore with more detail particular date. (Just draw a selection on the chart with your mouse to zoom to that area).


There is another story here that the first graph doesn’t tell well, which is the longevity of each movie as a revenue generator. For that we’ll chart each movie as a trend-line showing gross income from the release date to present time (making each movie’s release date day zero).

Wow. Check out the ever-green titles: Jurassic Park, E.T., Lord of The Rings, Gladiator, and even My Big Fat Greek Wedding. It will be interesting to see if The Force Awakens will have this kind of staying-power. Avatar, as you can see, has already gone into retirement.

With this chart is may be easier to compare revenue trends, but the density of data in the lower left corner makes a big chunk of the chart rather un-informative. Still, it beautifully illustrates how some movies remain audience favorites.


It has been said that there is no such thing as data overload, just filter failure. For this chart, it could be smart to group by genre as a way to clean up the display. Let’s use the legend as a filter. Click each genre below the chart to turn them on or off for comparison.

(I also attempted to make each individual movie title a legend you could turn on/off, but as you can see here, now the legends themselves become data overload.)


Hopefully, by now you agree with me in that there is more than just one way to illustrate the same data. Every representation tells a different story, and once you go beyond the regular bar, line or pie charts, data comes to life in new ways.

Can you think of other or even better ways to bring this data to life?

Are there other data-sets where this chart type would make sense?

Add your comments below and share a link to your JSFiddle or other site where you show off your work.