function load() {
  if (GBrowserIsCompatible()) {
    var map = new GMap2(document.getElementById("mapCanvas"));
    map.addControl(new GSmallMapControl());
    map.addControl(new GMapTypeControl());

		map.setCenter(new GLatLng(0,0),0, G_PHYSICAL_MAP);
		var bounds = new GLatLngBounds();
		GDownloadUrl("/map/map_data.php", function(data) {
			var xml = GXml.parse(data);
			var type = xml.documentElement.getAttribute("type");
			var markers = xml.documentElement.getElementsByTagName("marker");
			for (var i = 0; i < markers.length; i++) { //replace 6 with markers.length
				var name = markers[i].getAttribute("name");
				var address = markers[i].getAttribute("address");
				var city = markers[i].getAttribute("city");
				var state = markers[i].getAttribute("state");
				var zip = markers[i].getAttribute("zip");
				var phone = markers[i].getAttribute("phone");
				var url = markers[i].getAttribute("url");
				var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
				parseFloat(markers[i].getAttribute("lng")));
				var marker = createMarker(point, name, address, city, state, zip, phone, url, i+1, type);
				bounds.extend(point);
				map.addOverlay(marker);
			}
			map.setZoom(map.getBoundsZoomLevel(bounds));
			map.setCenter(bounds.getCenter());
		});
  }

	if (document.getElementById("largeMap")) {
		if (GBrowserIsCompatible()) {
	    var map2 = new GMap2(document.getElementById("largeMap"),
	    {size: new GSize(750,500)});
	    map2.addControl(new GSmallMapControl());
	    map2.addControl(new GMapTypeControl());

		map2.setCenter(new GLatLng(0,0),0, G_PHYSICAL_MAP);
		var bounds2 = new GLatLngBounds();
			GDownloadUrl("/map/map_data.php", function(data2) {
				var xml2 = GXml.parse(data2);
				var markers2 = xml2.documentElement.getElementsByTagName("marker");
				for (var i = 0; i < markers2.length; i++) { //replace 6 with markers.length
					var name2 = markers2[i].getAttribute("name");
					var address2 = markers2[i].getAttribute("address");
					var city2 = markers2[i].getAttribute("city");
					var state2 = markers2[i].getAttribute("state");
					var zip2 = markers2[i].getAttribute("zip");
					var phone2 = markers2[i].getAttribute("phone");
					var url2 = markers2[i].getAttribute("url");
					var point2 = new GLatLng(parseFloat(markers2[i].getAttribute("lat")),
					parseFloat(markers2[i].getAttribute("lng")));
					var marker2 = createMarker(point2, name2, address2, city2, state2, zip2, phone2, url2, i+1);
					bounds2.extend(point2);
					map2.addOverlay(marker2);
				}
				map2.setZoom(map2.getBoundsZoomLevel(bounds));
				map2.setCenter(bounds2.getCenter());
			});
	  	}
	}
}


function createMarker(point, name, address, city, state, zip, phone, url, i, type) {
		
		var myIcon = new GIcon(G_DEFAULT_ICON);
		if (i<100 && type<3) {
			myIcon.image = "/styles/images/hydrant"+i+".png";
	        myIcon.iconSize = new GSize(29, 47);
	        myIcon.shadow = "/styles/images/hydrantShadow.png";
	        myIcon.shadowSize = new GSize(60, 47);
	        myIcon.printImage = "/styles/images/hydrantShadow.gif";
	        myIcon.mozPrintImage = "/styles/images/hydrantMozPrint.gif";
	        myIcon.printShadow = "/styles/images/hydrant_PrintShadow.gif";
	        myIcon.transparent = "/styles/images/hydrantTransparent.png";
	        myIcon.imageMap = [ 10,39, 2,35, 3,15, 15,3, 27,13, 28,35, 14,46 ];
		} else if (type < 3) {
			myIcon.image = "/styles/images/hydrant.png";
	        myIcon.iconSize = new GSize(29, 47);
	        myIcon.shadow = "/styles/images/hydrantShadow.png";
	        myIcon.shadowSize = new GSize(60, 47);
	        myIcon.printImage = "/styles/images/hydrantShadow.gif";
	        myIcon.mozPrintImage = "/styles/images/hydrantMozPrint.gif";
	        myIcon.printShadow = "/styles/images/hydrant_PrintShadow.gif";
	        myIcon.transparent = "/styles/images/hydrantTransparent.png";
	        myIcon.imageMap = [ 10,39, 2,35, 3,15, 15,3, 27,13, 28,35, 14,46 ];
		} else {
			myIcon.image = "/styles/images/hydnt1.png";
	        myIcon.iconSize = new GSize(31, 24);
			myIcon.shadow = "/styles/images/hydrant-shadow.png";
			myIcon.shadowSize = new GSize(32, 27);
	        myIcon.imageMap = [7,0,8,1,10,2,11,3,11,4,12,5,13,6,13,7,13,8,11,9,12,10,13,11,13,12,13,13,12,14,11,15,12,16,12,17,13,18,13,19,13,20,12,21,13,22,12,23,11,24,10,25,9,26,7,26,6,25,6,24,5,23,3,22,1,21,0,20,0,19,0,18,1,17,2,16,2,15,2,14,2,13,2,12,2,11,2,10,2,9,1,8,0,7,1,6,2,5,3,4,3,3,4,2,6,1,6,0,7,0];
		}
        var markerOptions = { icon:myIcon };

  var marker = new GMarker(point, markerOptions);
if (url) {
  var html = "<b>" + url + name + "</a></b><br /><b>" + address + "</b><br /><b>" + city + ", " + state + " " + zip + "</b><br /><b>" + phone + "</b>";
  var link = url;
} else if (name) {
	var html = "<b>" + name + "</b><br /><b>" + address + "</b><br /><b>" + city + ", " + state + " " + zip + "</b><br /><b>" + phone + "</b>";
} else if (city) {
	var html = "<b><a href='"+ state.toLowerCase().replace(/ /,"-") + "/" + city.toLowerCase().replace(/ /,"-") + "/'>" + city + ", " + state + "</a></b>";
	var link = "/" + state.toLowerCase().replace(/ /,"-") + "/" + city.toLowerCase().replace(/ /,"-") + "/";
} else {
	var html = "<b><a href='/" + state.toLowerCase().replace(/ /,"-") + "/'>" + state + "</a></b>";
	var link = "/" + state.toLowerCase().replace(/ /,"-") + "/";
}
  GEvent.addListener(marker, 'mouseover', function() {
    marker.openInfoWindowHtml(html);
  });
  GEvent.addListener(marker, 'click', function() {
	if (link) {
		window.location = link;
	}
  });
  return marker;
}