if (GBrowserIsCompatible()) {
	function init() {
   		// create the map
      	var map = new GMap2(document.getElementById("map"));
      	map.setMapType(myMapType);
      	map.addControl(new GSmallMapControl());
      	map.addControl(new GMapTypeControl());
      	var location = new GLatLng(centerLatitude, centerLongitude);
      	map.setCenter(location, startZoom);


      	// Read the data from the XML file
      	var request = GXmlHttp.create();
      	request.open("GET", mapData, true);
      	request.onreadystatechange = function() {
        	if (request.readyState == 4) { // waits for a response acknowledging that the request is completed, ie, ==4
          		var xmlDoc = GXml.parse(request.responseText);
          		// obtain the array of markers and loop through it
          		var markers = xmlDoc.documentElement.getElementsByTagName("marker");
          		for (var i = 0; i < markers.length; i++) {
            		// obtain the attribues of each marker
            		var lat = parseFloat(markers[i].getAttribute("lat"));
            		var lng = parseFloat(markers[i].getAttribute("lng"));
            		var point = new GLatLng(lat,lng);
            		var html = markers[i].getAttribute("html");
            		var label = markers[i].getAttribute("label");
             		var webpage = markers[i].getAttribute("webpage");
            		var icon = markers[i].getAttribute("icon");
           			// create the marker by calling the createMarker() function already defined above
            		var marker = createMarker(point,label,html,icon,webpage);
            		map.addOverlay(marker);
          		}
				//put the assembled side_bar_html contents into the side_bar div
          		// document.getElementById("side_bar").innerHTML = side_bar_html;
          		
          		// ========= Now process the polylines ===========
          		var lines = xmlDoc.documentElement.getElementsByTagName("line");
          		// read each line
          		for (var a = 0; a < lines.length; a++) {
            		// get any line attributes
            		var color = lines[a].getAttribute("color");
            		var width  = parseFloat(lines[a].getAttribute("width"));
            		// read each point on that line
            		var points = lines[a].getElementsByTagName("point");
            		var pts = [];
            			for (var i = 0; i < points.length; i++) {
               				pts[i] = new GLatLng(parseFloat(points[i].getAttribute("lat")),
                           	parseFloat(points[i].getAttribute("lng")));
            			}
            	map.addOverlay(new GPolyline(pts,color,width));
          		}
          		// ================================================     
        	}
      }
      request.send(null);
	}
}
else {
      alert("Sorry, the Google Maps application is not compatible with this browser");
    }


 window.onload = init;
 window.onunload = GUnload;