Wednesday, September 20, 2006

Playpen #1 - Google Maps

Inspired by Jeremy Keith's piece at d.Construct the other week, I've finally dipped my toe in the water of fiddling with APIs - and like many, I decided to go for a Google Map.

It helped that there was a tutorial about that very subject in .Net magazine (issue #153), but when I tried it out, it wasn't working properly. I checked my typing repeatedly for spelling errors, but couldn't find why the map was rendering OK but the overlay bubble was not. Firefox's JavaScript debugger kept coming up with some weird error message about XML mismatches on a line which didn't even exist in the file!

So I turned to my newly acquired tome by Chris Heilemann (see, Chris, after your earlier teasing, I did go out and buy it!): Beginning JavaScript with DOM Scripting and AJAX. Sure enough, in the AJAX-based chapter at the end, I found Chris' take on Google Maps.

Between that, and the Google Maps documentation, I finally figured out how to make a map, add custom marker, and have the info bubble pop up when the marker is clicked. You can see my bit of fun on the Playpen #1 page

3 comments:

Ross Bruniges said...

Heya Caroline (one of my many golf paparazzi)

Hope you are enjoying playing around with the old google maps! I have had this lurking in my 'dungeon of projects I have not been provided sufficient content for' for a while now - may be interested in having a peak :>

http://www.lsbu.ac.uk/about/dev/googleMap-try2.html

Happy googling

Clive Walker said...

The official Google page could do with a few more examples IMO but I found this tutorial pretty useful for Google maps.

Caz Mockett said...

Thanks for the link, Clive, I'll check it out.