tomputer

If you’re viewing this post in your feedreader, head over to the site to see the example graph!

I’ve been experimenting with Javascript libraries for building graphs dynamically in the client browser. In the past if I’ve wanted to create simple bar graphs I’ve used divs and css – an approach has the advantage of being super lightweight (read “fast”) and usually works cross-browser without too much hassle. The big disadvantage is that it’s inflexible (limited to bar graphs and difficult to update the data once the graph has been rendered) and is a pain to code if there’s more than a couple of rows of data to be plotted.

A few minutes on Google last week came up with a couple of examples of Javacript libraries that can produce much fancier graphs. I’ve settled on PlotKit because it produces beautiful graphs, works in the major browsers (using either Canvas or SVG) and has the most developer friendly licence, .

The example below gets a feed of the BT shareprice from Google (fed through a Yahoo Pipe to convert to JSON – the pipe can be reused as it takes the ticker symbol as a parameter). It then iterates over the feed data to populate the graph and finally calls render() on the graph object.

A handy library to keep in your developer toolbox!

Although not relevant for the data I’m graphing here, PlotKit can also draw really sweet pie charts.

So I’ve been messing around with various different widget frameworks on and off over the last few months as preparation for a workshop I’m going to be involved with. I started out with Yahoo Widgets (née Konfabulator) mainly because the examples that I’d seen looked the prettiest. Although perhaps not strictly widgets, I’ve also started to look at facebook applications, but that’s a subject for another day. My favoured widget framework at the moment is Google Gadgets for a number of reasons:

• The barrier to entry is low because it’s pretty much standard javascript and html with an xml descriptor.
• You write a gadget once and can view it in iGoogle, GoogleDesktop, Blogger or in an iframe embedded in any webpage.
• As with all Google APIs the documentation is great and there’s a lot of developer support.
• It plays nicely with other Google APIs.
• …finally, if you’re going to back one widget framework, who would bet against Google?

I find the best way to learn is just to get stuck in so I created a couple of simple examples, one to display a user’s timeline from twitter and another to display recent announcements made on another site I wrote, Tell’M. They both follow very similar principles: pull down an rss feed, parse it for interesting fields and render the display. Both also have a few user preferences that can be set to customise the feed.

My interest had moved on to other things recently but this week I started to look at gadgets again because the workshop is coming up soon. I found my two gadgets in the google directory and was disheartened to see that my twitter gadget had received two negative comments – one because of a security restriction of ajax (cross-domain policy) and twitter (which will only accept a POST to update status so I can’t use script injection). After a bit more digging around I found that Google now display average weekly page views for gadgets and my twitter gadget is receiving 14,546 page views per week! I guess it’s easy for a developer to do something just to satisfy their own curiosity and think that nobody else will ever use it. I’ve now added Google Analytics to both my gadgets just to check that all those page view are not generated by me!

Last week I attended the 2-day Future of Web Apps conference at London’s ExCel. I really enjoyed this conference – there were some great speakers and I learned a lot. I hope to write a couple more posts this week covering the highlights.

One of the weirdest experiences was attending presentations by people that I’ve never met before but whose blogs I read/websites I use/podcasts I listen to or watch. It’s strange how I read BBCNews nearly every day, and on Sundays I often read The Times, but I’ve no idea who the people are that write the articles I read and yet in the tech world I know a surprising amount about the people behind sites such as GigaOM, ScriptingNews, Scobelizer (for example I know that Dave Winer has just got a Nokia N800 and the Robert and his wife Maryam have just had a new baby son, Milan). Continue Reading »

Tell’M is an app I’ve been working on in the background for a few weeks. The idea is that it becomes a kind of online version of the announcement pages from the local newspaper but with all the usual web2.o goodness of tagging, data feeds (rss and kml so far) and comments. A location is specified for each new announcement which allows us to produce a rolling map of posts, twittervision style (yes, on a google map, and yes I know, everything I’ve done recently has involved google maps!). I’ve also recently added the ability to associate a photo when making a new announcement: We decided not to let users upload their images to us because there are already tons of sites that do a great job of online photo storage (and who wants to have another place to upload pics to, right?) so instead we let users search flickr by tag, location or flickr username. To do this I’ve used the (very cool) flickr JSON API and I’ve also played around with Google’s picasaweb api to see if I could do something similar with their site.

As well as allowing users to keep up with Tell’M in their favourite feed reader, the rss feeds allow us (or anyone else) to consume Tell’M data in other apps. Along these lines a colleague has already created a widsets application for Tell’M to allow posts (including images) to be viewed on a mobile phone (go to the widsets library and search for “BT”), and I’ve created a google gadget (more on this in a later blog post).

So far this one seems to have generated quite a bit of interest amongst our team and everyone seems to have feature suggestions, which has to be a positive sign. Also, Mike Pegg from the GoogleMapsMania blog covered Tell’M here, and it’s also been featured by BTInnovations.