Home arrow Web Authoring arrow Introducing the Google Maps API

Introducing the Google Maps API

Maps are becoming ubiquitous in web applications. They are being used as an effective and non-intrusive way of gathering geo-specific data from the user or to present geo-specific information to the user -- for example, for tracking reports of shipments. However even two years ago, embedding a map within an application was a specialized area that required a good understanding of Geographical Information Systems (GIS). This changed with the arrival of Google Maps and its corresponding set of APIs, known as the Google Maps API.

Author Info:
By: A.P.Rajshekhar
Rating: 5 stars5 stars5 stars5 stars5 stars / 16
June 06, 2007
  1. · Introducing the Google Maps API
  2. · More Google Maps API Functions
  3. · Using the Google Maps API, Step By Step
  4. · The Google Maps API in the Real World

print this article

Introducing the Google Maps API
(Page 1 of 4 )

Now a developer with a good grasp of JavaScript can without much ado embed an interactive map in a web application using the Google Map API. The questions that arise next are what exactly is the Google Map API and what are the steps one needs to follow in using it. The answers to these questions is the focus of this discussion.

In the first two sections of this article I will deal with the whys and wherefores of the Google Maps API. In the third section I will detail the steps you need to take when using the Google Maps API. The last section will focus on a real world example based on the steps discussed in third section. That is the outline of the discussion.

What is the Google Maps API?

Google Maps provides not only the map, satellite image or a hybrid of both but also an extensive range of operations on the map such as zooming, panning, information pop-ups, overlays and so forth. Google Maps API provides an interface into these operation through JavaScript objects. The beauty of the setup is that the functions work in the same non-intrusive way as the original Google Maps without the developer needing to know the details of AJAX or how it is implemented in Google Maps. The developer only needs to know the classes and their methods to access the services of Google Maps. The functions exposed by the Google Maps API can be categorized as follows:

  1. Configuration
  2. Controls
  3. Map Types
  4. Map State
  5. Overlays
  6. Information Window
  7. Map Navigation
  8. Events

The access to most of the group of functions mentioned above is through the methods of the GMap2 class. The GMap2 class forms the basis of map creation, display and manipulation.


All of the aspects of any map provided by Google Maps are configurable, whether it's the enabling of dragging and information windows or continuous zooming. The methods of the GMap2 class sectioned under configuration enable configuration of the map. The following are the most often used methods for configuring maps:

  • enableDragging() enables the dragging of the map. Dragging is enabled by default.
  • disableDragging() disables the dragging of the map.
  • enableInfoWindow() enables the information window.
  • disableInfoWindow() disables the displaying of the information window.


The UI elements, using which the user controls the map and its functions, come under the controls category. There are two main methods related to controls. These are:

  • addControl(control, [position]) adds the specified control to the map at the place specified by the position parent. The position parameter is optional.
  • removeControl(control) removes the specified control from the map.

Both of the above functions take instances of the GControl class. There are five existing instances of the GControl class: GSmallMapControl, GLargeMapControl, GSmallZoomControl, GScaleControl and GMapTypeControl. These can be passed to the addControl() method to add controls to the map.

blog comments powered by Disqus

- Top WordPress Plugins for Social Media
- How to Install WordPress on WAMPP
- More of the Best Wordpress Plugins for Comme...
- Top Wordpress Plugins to Fight Spam
- More of the top Drupal modules for SEO
- Top Drupal Modules for SEO
- More Top Wordpress Plugins for SEO
- Website Optimization Tips
- Backup and Restore a Drupal Website and Data...
- 5 Best Web Font Services
- Web Font Embedding Services
- Joomla Site Administration
- Create PHP Pages that Use WordPress Templates
- Top Joomla Extensions for Social Networking
- Drupal Modules for Site Navigation

Watch our Tech Videos 
Dev Articles Forums 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Write For Us 
Weekly Newsletter
Developer Updates  
Free Website Content 
Contact Us 
Site Map 
Privacy Policy 

Developer Shed Affiliates


© 2003-2018 by Developer Shed. All rights reserved. DS Cluster - Follow our Sitemap
Popular Web Development Topics
All Web Development Tutorials