146 Part III — Google Map Hacks
Listing 9-1 shows the entire HTML for an example demonstrating this process. The map
shows a list of restaurants in Grantham in the U.K., and the remainder of the chapter demon-
strates how to extend and improve on this original goal.You can view this example, and all the examples from all of the chapters, online by using the
chapter number and listing number. For example, to view the map generated by Listing 9-1, use
the URL http://maps.mcslp.com/examples/ch09-01.html.Listing 9-1:A More Complex Multiple Marker HTML Example<!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 9, Ex 1</title>
<script src=”http://maps.google.com/maps?file=api&v=1&key=XXX”
type=”text/javascript”>
</script><script type=”text/javascript”>var map;var points = [];
var index = 0;var infopanel;function onLoad() {
if (GBrowserIsCompatible()) {
infopanel = document.getElementById(“infopanel”);
map = new GMap(document.getElementById(“map”));
map.centerAndZoom(new GPoint(-0.64,52.909444), 2);
addmarker(-0.6394,52.9114,’China Inn’);
addmarker(-0.64,52.909444,’One on Wharf’);
addmarker(-0.64454,52.91066,’Hop Sing’);
addmarker(-0.642743,52.9123959,’Nicklebys’);
addmarker(-0.6376,52.9073,’Siam Garden’);
}
}function addmarker(x,y,title) {
var point = new GPoint(parseFloat(x),parseFloat(y));
points.push(point);
var marker = new GMarker(point);
map.addOverlay(marker);