Friday, August 10, 2007

Build a Quick 'Google Maps' Mashup with Google Mashup Editor

Google Mashup Editor (GME) is an online 'mashup' building tool by Google, just like Yahoo! Pipes & Microsoft Popfly, but quite different per se. Right now, it's use is only on an invitational basis so those reading this but do not have an account can register at GME's site for an invitation.

This is a quick walkthrough of my first mashup using GME - BlogUSphere Moods! GME mainly works on the premise that user has access to an RSS feed of the data he wants to do a mashup of - and it's premise is not far-fetched if you know about Yahoo! Pipes and services like dapper. Even the GME FAQ claims Pipes and GME are friends not foe. So, let's explore it, but before that I must add, GME is best suited for Google Maps Mashups [just because it makes them so ridiculously easy to build].

OK, heard of 'We Feel Fine'? These guys search the blogosphere for posts containing 'feelings' [keywords like: happy, sad, fine etc.] and index them [with hordes of information]. They have made this information available freely through an API. I decided to make a quick mashup based on it - to show recent moods of bloggers on google maps. Earlier my plan was to include blogger emotions from around the world but for some cryptic reason [& I being very impatient to sort that out] I wasn't able to obtain entries from other countries on my first try but only the US. Thus, my mashup name has - blogUSphere - in it. Actually, it was a problem with the URL but yawwwnnn...

Moving on. It's a REST API [Go here for the docs]. So obtaining results was easy, through Pipes. See my pipes code. For first time users, I can only say that explore it, it's too easy - just take a look at some Perl's RegEx tutorial. It'd come handy. Also, note how I 'renamed' the tags to title, link, description [standard RSS] & geo:lat, geo:long [needed to enable Google Maps to fetch lat-long data in GME]. Now, save your pipes app, and obtain RSS feed of it.

Open GME - goto Feed browser - select 'Remote Feed' - paste your feed URL and see the results. This was just to ensure that every tag is in place. Now, if you are not a stickler for looks 'n all then all you need to do is: open Sample projects in the editor, browse to the Maps mashup sample app and replace the feed url written in it's code [look closely, it's written somewhere] with your pipes RSS feed url. Run it in Sandbox. It'll work! [adjust pagesize]. Howzzaat?

It took me 73 minutes - and you being a smart-ass would't take more than 7+3=10 mins. Go build your own mashAPP!

P.S. You can add JS code in GME - so the first things that came into my mind was 'Adsense' ;) ...and it works in it! [For some reason [given in gme groups] it wouldn't work inside tables]
P.S. 2: Also, the RSS feed is cached in GME and the crawler goes out to 'crawl' in a 30-60 mins. interval time - so, don't panic if you don't see your feeds updating - it's a limitation with GME right now.
AddThis Social Bookmark Button

3 Comments:

p e k o s ROB said...

hey man awesome blog. i just saw it because i was looking for an image of an ipod... check out mine at http://pekosrob.blogspot.com i'm working on getting a banner for the reviews section... can't think of an idea for my primary blog though. how do you get those "recent readers" or whatever it's called on your page?

pagfloyd said...

tht's a widget provided by mybloglog if you become a member there (free registration)

Sneezy Melon said...

umm...how do I contact you? this is urgent. mail me at

(sneezymelon AT gmail DOT com)