Month: April 2013

tweets… on a map!

/ Daphne Chong / Leave a comment

I love hack days; they’re a great chance to remind yourself what’s possible in insanely short time periods.  Last week we were given 24 hours over two days at work (2pm – 2pm) to build anything we liked, using any kind of technology.

I was very curious about the Twitter API and wanted to investigate different tools and libraries around that offer Twitter support. Partly because there was an upcoming team forming at work around Twitter functionality (which I am now on! Success!) and partly because social integration products are always fun.  I didn’t really mind what the project was, but I did want something working by the end.  In the end I teamed up with a fellow new developer Gareth Hughes, and we built Tweets on a Map*.

Inspired by the UK Snow Map, which shows you where it is snowing in the UK based on user tweets, we wanted to visualise tweets over a map of Sydney in real time. So we asked users to tweet at an account (@tweetsonamap), with a postcode, a rating out of ten, and an optional message.

@tweetsonamap 2017 8/10 We're feeling pretty good today!
We used TweetSharp to interact with the Twitter API, an open source library written in C#. It was surprisingly easy to make the first call to a non-streaming API; TweetSharp hides all of the complexities of OAuth from you. Simply plug your API credentials and it worked. An example from the documentation:
using TweetSharp;

// In v1.1, all API calls require authentication
var service = new TwitterService(_consumerKey, _consumerSecret);
service.AuthenticateWith(_accessToken, _accessTokenSecret);

var tweets = service.ListTweetsOnHomeTimeline(new ListTweetsOnHomeTimelineOptions());
foreach (var tweet in tweets)
{
    Console.WriteLine("{0} says '{1}'", tweet.User.ScreenName, tweet.Text);
}

Getting the streaming endpoints to work  not as simple. We had to create a patched version of TweetSharp that fixed a bug with deserialization when getting a user’s timeline in realtime (based on a pull request by kensykora that has now been merged into master).  There were also no options to customise the parameters given to the API, for example to get all replies for a user’s timeline. But other than a few hiccups, it was nice to have the API abstracted away.

On the front end, we used SignalR to push the incoming tweets straight to Google Maps. The Google Maps API is lots of fun to play with, mostly because there are some comprehensive code samples that show what it can do. Gareth was the SignalR wizard and got us up and running using this stock ticker example.

By 9pm on the first day, we had our working prototype that listened to a tweet stream, picked up new tweets, parsed the postcode and displayed the tweet on a map at that location. It’s definitely the most relaxed hackathon I’ve ever participated in. We both went home, got a good night’s sleep and made things pretty before the presentations at 3pm. We even had time to make a prezi.

Result: we won Mi9’s most viable product award for Hackathon, and came 3rd in the popular vote category! We were pretty pleased with that.

Learnings:

  • Like a boy scout, be prepared. The TweetSharp API was investigated and patched before the hackathon started, avoiding the stress of working out the bugs during crunch time. We also got code samples of SignalR and read the Google Maps documentation.
  • TweetSharp is a nice library to use for twitter, but be prepared to tweak the edges if you need to. Luckily, it’s open source and hosted on GitHub.
  • SignalR is shiny.
  • I personally learned a lot about the Google Maps API and more javascript, which I’d like to learn properly this year.

* Disclaimer: the code has no tests – it was a hackathon after all 🙂