Learning JavaScript

Google Maps

One of the most famous Ajax/DHTML/JavaScript applications is Google Maps. It became even more popular when the company released an API that enabled people to quickly and easily add sophisticated mapping to their web pages. This one application, more so than probably any other, is what fires the imagination regarding Ajax and the ability to mix and mash technologies.

It’s not unusual for people to record the longitude and latitude of a photograph’s location into that photo (a process known as geocoding), which is then parsed out and passed to a Google Maps API call. A map is then created to show exactly where the photo was taken.

Geocachers, that group of passionate global positioning satellite (GPS) users, utilize Google Maps to mark geocaches (hidden objects of little or no value used as a way to mark the spot). Others use Google Maps to provide driving directions, to mark landmarks, or even play games. It’s a rich and easy-to-use API.

To use Google Maps, you first need a free API key, which you can get at the Google Maps API web site (http://www.google.com/apis/maps/). This is used as part of the URL given in the src attribute of the script tag. For instance, the following shows how I use my key for learningjavascript.info:

<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;
key=ABQIAAAAprpnCG3LM_SOd5dAqo4g7RThwcj_1x2ShM2_WlFws98yyiZZxRQyUhBJw9Ty1j6jpEUo_v6PFZfJdQ"  type="text/javascript"></script>

That key has to match the exact domain and subdirectory location ...