Project Introduction

Created

Jan - Mar, 2017

Brief

D3.js based charts and graphs illustrating Twitter users' reaction during the 89th Academy Awards Ceremony.

Tools

Python, D3.js, HTML/CSS

Data

Streaming data crawled from Twitter.

This project is for my master's degree. I always heard about how great data visualization is and seek chance to get involved. Last time, I tried to work on existed data and sketch all graphs and charts with Illustrator. It turned out to be not bad. With my familiarity of coding and design developing, I decided to run this project from the very beginning of mining data to visualization with codes.

I learned about data mining, especially with social media, from Marco Bonzzanini's book: Mastering Social Media Mining with Python.

With analyzed and processed, streaming tweets data are devided into three main sections: nominees and films mentioned from time to time, geographic information and term frequency. Correspondingly, I made a line-chart with time-series, a spinning globe with users' locations highlighted and a bubble chart of top 450 term frequency.

These charts and graphs follows the lead of Mike Bostock's incredible examples and many other great examples and tutorials.

The line chart with time-series displays numbers nominees or films mentioned in tweets by time. It can be switched by two radio buttons between "Films" and "Nominees". Each situation consists of twenty names. For "Nominees", I added Jimmy Kimmel, the host, into the list instead of certain nominee without data.

The key feature of this chart lies in the strategy of "focus" and "context". The chart and the time axis(x) can be zoomed with the brush below. There are also legends on the right side marking different lines by color. The colored squares function as the switch to show or not show corresponding lines. The number axis(y) will be adapted into proper range as the maximum of existing lines.

The spinning globe shows locations of those tweets with geo information. The amount is displayed with the color(opacity) varying from shallow to deep.

Last, the bubble charts illustrated the top 500 term frequency. The size of bubbles represents the frequency. The color of bubbles is random generated with the similar hue.

Films/Nominees
Globe of Geo Info
Top 450 Term Frequency