Chapter 11 — Building a Community Site 215
The references used here for the offsets are probably a little generous, but the spacing helps the
clarity on what could be a busy map.
Filtering Data through Layers of Information
The basic structure of the application is the same as in Chapter 9, except that the user selects
entities, not towns, as the first step. Each time the user selects an entity from the list, the mark-
ers, using the appropriate icons, are populated on the page. Multiple entity types can be dis-
played on the map at the same time.
You might want to read Chapter 9 if you have not already done so before continuing with the
rest of this section because many of the basic principles are the same.
The effect is to provide multiple layers of information that the user can select or hide as
required.
To achieve this, when entities are loaded they are created locally as objects within JavaScript. It
is the objects, rather than the markers and points, that are added to a global array. That means
that the markers on the map are identifiable by more than their marker object. Using this
method, you can display the map with different types (using different icons), remove markers
of different types, and perform other types of manipulation, because the marker information
overlaid on the map is derived from an object that defines all the information required.
HTML Preamble
Once again, the HTML preamble is familiar:
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”content-type” content=”text/html; charset=UTF-8”/>
<title>MCslp Maps Chapter 11, Ex 01</title>
<script src=”http://maps.google.com/maps?file=api&v=1&key=XXX”
type=”text/javascript”>
</script>
<script type=”text/javascript”>
Global Objects
Much less information needs to be stored in global variables, because the bulk of the marker
information is stored as objects within a single array: