184 Part III — Google Map Hacks
<city title=”Los Angeles, Calif.” lat=”34.052220” lng=”-118.242780”>
<pop year=”2004” value=”3845541”></pop>
<pop year=”2000” value=”3694820”></pop>
<pop year=”1990” value=”3485398”></pop><city title=”San Francisco, Calif.” lat=”37.775000” lng=”-122.418300”>
<pop year=”2004” value=”744230”></pop>
<pop year=”2000” value=”776733”></pop>
<pop year=”1990” value=”723959”></pop>
</city>
<city title=”Columbus, Ohio” lat=”39.961100” lng=”-82.998900”>
<pop year=”2004” value=”730008”></pop>
<pop year=”2000” value=”711470”></pop>
<pop year=”1990” value=”632910”></pop>
</city>
</citypop>The XML file is used in all of the examples in this chapter to demonstrate the different styles
of statistical data representation available within a Google Map. The information could just as
easily have been inserted into a database and then loaded dynamically; however, with static data
like this (the population of New York in 2004 is unlikely to change now!) a static file is a suit-
able format for the information.Using Polylines
In earlier chapters, the Google Maps polyline was used to show and highlight information on
the map. The polyline is a simple line-drawing tool provided by the Google Maps software
that draws a line between two points (or between pairs of points if there are more than two).
However, because the definition of the polyline is so flexible, you can use that flexibility to your
advantage and adapt it for other uses. Following is the definition for a new GPolylineobject
(question marks indicate optional arguments):
GPolyline(points, color?, weight?, opacity?)The first argument is the array of points, the second the color (as specified using the HTML
#ff0000format), the third the weight (that is, the width in pixels of the line) and the opacity
of the line drawn (as a float between 0 and 1).By adjusting the argument values and the array of points you can achieve a number of different
techniques for highlighting data.Basic Point Map
Using XML it is possible to create a very simple map with a marker showing each of the cities.
Because this is a basic process (first covered in Chapter 8), I won’t provide too much detail on
the process, but the base code used and described here will be modified and expanded to work
as the base for plotting the information onto a Google Map.As with other examples, the trigger for the code is the onLoad()function, which is called
when the page loads. As you can see in the following code for that function, you can parse the