simple google map “hack”

Many moons ago I posted about some library fun with google maps API. I’ve finally made some time to add data into the map I had for the Western Springs History (for which I also chose a new WordPress theme). Take a look at the Western Springs History interactive map, and if you like it, here some code. Libraries could use something like this to display the location of the building/s, or maybe just map out the best places to eat around the library.

The code for the map calls in an XML file named “data.xml” which should reside in the same directory as your HTML file. You’ll need to change one thing in the code before you try load it into a brower. Sign up for a google maps api key and paste it in where the code instructs towards the top of the document. You’ll likely also want to Ctrl-F to find “map.centerAndZoom(new GPoint(-87.899300, 41.812600), 3).” The first two numbers are the latitude and longitude that will be displayed when your map is loaded. The third number is the level of zoom. Unlike Yahoo! Maps, Google Maps doesn’t do any geocoding, so you can’t simply enter an address for your new GPoint. Fear not, you can use the free geocoder.us to get the lat/long data of an address.

There are all kinds of fancy things you can do with the XML, but here’s what I chose for my map:

<markers>
<marker lat=”XX.XXXXXX” lng=”-XX.XXXXX” img=”URL TO IMAGE” descr=”TEXT THAT APPEARS ON THE RIGHT” addr=”ADDRESS INFO” url=”LINK TO HOUSE RECORD”/>
</markers>

Add in as many points are you like.

Once you have an HTML file with the altered code and a data.xml file in a folder, open it up and see what happens. You can easily customize your map further by reading the Google Maps API Documentation. Also take a look at EZ Maps and the list of map projects from Mapki.

One thought on “simple google map “hack””

Leave a Reply