This visualization animates box office results over a twelve week window. Each circle represents a movie sized by theatre counts, Facebook likes, Rotten Tomatoes audience or critics score or budget. To start an animation select a week in the bar chart. The average movie is show in theatres for four weeks. Most revenue results in the first week, but a successful movie can stay in theatres more than three months. Select a week in the bar chart to start an animation.
Big budget movie The Dark Knight Rises, released July 20th, 2012, with high audience and critics scores on Rotten Tomatoes, earned more than $220m in the first week and kept a strong theatre presence past week six.
John Carter, released March 9th, 2012, demonstrates, low audience score and low social media interest will result in poor box office earnings despite a large budget.
This Box Office Visualization was developed in d3.js. The original inspiration was Hans Rosling's 2006 2006 TED talk. I dreamed of creating my own time-series animation on the fun topic of movies. The user should play around and see what trends they can discover.
The bar chart stops and restarts the animation according to week. I used a novel approach to animation where new layers of movie data are added as the time series progresses. Each animation interval potentially introduces new set of movies as circles at week zero. These are new releases. Once a movie is added to the animation a recursive transition is applied, changing it's X and Y position as well as sizing according to user option. The user can stop the animation by clicking on on any circle as well as hover to view release date and sizing value. To prevent text cluttering, titles are removed after week six.
Chris Leuer
Emailcleuer@g.harvard.edu
ProjectFinal project for CS 171 Data Visualizations
Process BookData from external websites and APIs was collected and used to display the visualization.