Chapter 7: Extending the Google API Examples
By combining all of these elements, you can create quite complex applications, even though the
core of the application code is still based on the comparatively simple JavaScript language.
Overlays
Overlays consist of information that is displayed on top of a map of a particular location. There
are two basic types:
Markers or points:These are generated within the application through the GMarker
class. They are based on an icon and a shadow (at a 45-degree angle) and can be used to
denote any information you want. In general, an icon is used to highlight a specific item
and is, therefore, usually a pointer, arrow, or other construct that gives a specific reference
point. For example, you would use a marker to indicate the location of a business on a
map so as to give a precise location. To show more detailed information about a specific
location, you use an information window.
Polylines:These are used when you want to provide a route across a map, or when you
want to draw a specific shape on the map. For example, you might use a polyline to
denote the boundaries of a property on a map.Events
Events are used to communicate specific occurrences of an operation. For example, an event is
raised when the user clicks a marker, moves the map, zooms in on the map, and so on.
To provide interactivity in your application, you can assign functions to be executed when an
event occurs. A common example is when the user clicks a marker: Most maps center the map
on that marker and provide an information window showing more information or detail about
that particular point. In the Google Local system, for example, searching for a business on a
map and then clicking one of the available markers provides you with the address, phone num-
ber, and, if available, other information for the business denoted by the marker.
Information Windows
Additional information is usually displayed in an info window, which is a sort of speech bubble
that is overlayed on the map. The info window usually appears in response to the user selecting
a marker, either by clicking the marker in the map or by clicking a separate list of markers that
is also displayed on the page.
Information windows can be as simple or complex as you like. They can contain simple text or
full-blown HTML, incorporating images and other elements. As already noted, info windows
appear in Google Local when the user clicks a business marker.
The Google Maps API includes a suite of functions for triggering, displaying, and formatting
the content within an info window.