In preparation for next year’s Sucata Run to Split, I was pottering about with some updates to the Team GI blog. The plan was to be able to display our current location on the blog using or Twitter location (which we could set with BrightKite or an iPhone). Anyway, it is very simple to do using the TwitterVision API. Here’s how I did it…
1. Add a div to your page where you want the location info to go, make it’s id your Twitter screen name like:
<div id="scottmliddell"></div>
2. You need a simple bit of code to extract the information and format it:
function loc(locObj)
{
var loc="";
loc += "Longitude: " + locObj.location.longitude + "<br>";
loc += "Latitude: " + locObj.location.latitude + "<br>";
loc += locObj.profile_location + "<br>";
document.getElementById(locObj.screen_name).innerHTML = loc;
}
You can download this as a file here.
3. At the bottom of the HTML page you want to add the location to, add:
<script language="javascript" src="/loc.js" type="text/javascript"></script>
<script
src="https://twittervision.com/user/current_status/scottmliddell.json?callback=loc">
</script>
Obviously replace my Twitter screen name with yours.
It will look like this:
Where am I?
There is much more info you can grab out of the API – this is just a very simple version. I’ll leave styles and formatting to you.
