jQuery P2PU Exercise 2 with Google Maps

Posted on Feb 9, 2011 in App Dev, News

I had this really amazing plan to actually create a video of the process – first starting with a simple table, then displaying the Maps integration. But, it’s a bit late and I may need to wait a little later.

For the second exercise, the charge was to iterate through a JSON formatted list of students and to output the data into a table or some container of sorts in which you needed to iterate through the object. I figured I’d run it through the Google Maps API and display all the names on a map by City and State using the Lat/Lon values. Here’s my output from the exercise iterating through the array and ultimately loading the map. Yesterday’s post brought to the surface a couple of nuances in dealing with jsFiddle, so in getting things running be sure to take in account a few points of notice:

1. I setup jsFiddle so that no libraries were loaded automatically. So I chose the “no wrap (head) / No Library (pure js)” options for the library. This worked … auto-including the library did not work for me.
2. I loaded the Google JSAPI directly into the page via the Manage Resources tab. In doing so I had to add the “fake=js” parameter to the url. (http://www.google.com/jsapi?fake=.js)

Related posts:

  1. Google JSAPI & JSFiddle: relationship problems? Just a little miscommunication.