Configurable Twitter Visualization




Intro


I built this realtime Twitter visualization using the Twitter streaming API, Node.js, the Google Maps API, and Socket.IO, and then I open-sourced it.

I used this app to deploy a demo instance on realtimehungermap.com. It aggregates tweets from around the world by filtering the Twitter streaming API for tweets on the topic of eating, hunger and meals. By using Socket.IO, I am able to make a single connection to the Twitter streaming API with my app - that is then broadcasted out to every connected client.

Hunger is just one potential topic. It's possible to use this app to display Tweets of any subject in this app. Simply edit a single configuration file to customize the Twitter topics, the look and feel of the app, its static content and more.


Screenshots





Key Features


  • Node.js, Socket.IO, Google Maps API
  • Aggregates Tweets by Location
  • Zoom Out to See Time-based Trend Information
  • Applicable to Any Subject on Twitter

Technical Details & Takeaways


I spent a lot of time becoming very familiar with Twitter's API while working at BrightContext. I realized it would be relatively easy to create a compelling display by querying the Twitter Streaming API for tweets on a given subject and aggregating them by location.

After creating a stream of tweets in Node.js, I inspect them for geodata. Most tweets don't have accurate geolocation data. Therefore, I pick off the placename from the tweet hand them off to Google's Geolocation API for geocoordinates that can then be drawn on the map.

The really exciting thing about this app is that by changing a few lines of code the map could report on any subject being discussed on Twitter at any given time. I chose hunger because it's active enough to make for an interesting visual display.