function onLoad() {
		//create the map & controls
		var map = new GMap(document.getElementById("map"));
		map.addControl(new GLargeMapControl());
		map.addControl(new GMapTypeControl());
		map.centerAndZoom(new GPoint(-112.030207, 33.516250), 10);
		 
		// Download the data in data.xml and load it on the map. The format we
		var request = GXmlHttp.create();
		request.open("GET", "!map/data.xml", true);
		request.onreadystatechange = function() {
			if (request.readyState == 4) {
				var xmlDoc = request.responseXML;
				var markers = xmlDoc.documentElement.getElementsByTagName("marker");
				
				for (var i = 0; i < markers.length; i++) {
					var tourney = parseFloat(markers[i].getAttribute("tourney"));
					var Lat = parseFloat(markers[i].getAttribute("lat"));
					var Lng = parseFloat(markers[i].getAttribute("lng"));
					var point = new GPoint(Lng, Lat);
					
					// Show the following HTML in the info window when it is clicked
					var html = markers[i].getAttribute("name")+'<br>'+
								markers[i].getAttribute("add1")+'<br>'+
								markers[i].getAttribute("add2")+'<br>'+
								markers[i].getAttribute("event")+'<br>';
					//dest is just a way to combine lines 1 & 2 of the address so they can be sent to maps.google.com					
					var dest = markers[i].getAttribute("add1") + ',' + markers[i].getAttribute("add2");
					//dirLink is the "get directions to here' link. It uses the 'dest' var and contains a form.
					var dirLink = '<form action="http://maps.google.com/maps" method="get"><label for="saddr"><span class="tiny">Your Address: &nbsp;&quot;1 Main St, Phoenix, AZ 85000&quot;</span></label><br><input type="text" SIZE=40 MAXLENGTH=40 name="saddr" id="saddr" value="" /><br><INPUT ID="SUBMIT" TYPE="SUBMIT" VALUE="Get directions to here."><input type="hidden" name="daddr" value="'+dest+'" /><input type="hidden" name="hl" value="en" /></form>';
					//info is just a combination of all the other information that is put together to be displayed in the popup
					var info = html + dirLink;
					if (tourney == 1){
						imageurl = "!map/black.png";
					} else {
						imageurl = "!map/yellow.png";
					}										
					// Creates a marker whose info window displays the given number
						var marker = createMarker(point, info);
						map.addOverlay(marker);
					
					
				}				
			}
		}
		request.send(null);
    }

	// This is the code I used so I could have custom markers. If you want to use default markers
	function createMarker(point, html) {
		var icon = new GIcon();
					icon.image = imageurl;  
					icon.shadow = "!map/shadow.png";
					icon.iconSize = new GSize(18, 49);
					icon.shadowSize = new GSize(60, 51);
					icon.iconAnchor = new GPoint(9, 49);    
					icon.infoWindowAnchor = new GPoint(12, 3);
		var marker = new GMarker(point, icon);

		//this is the listener that tells when someone clicks on a marker
		GEvent.addListener(marker, "click", function() {
			marker.openInfoWindowHtml(html);
		});

		return marker;
	}