// JavaScript Document
function load() {
  if (GBrowserIsCompatible()) {
  	var map = new GMap2(document.getElementById("map"));

map.addControl(new GSmallMapControl());
		map.addControl(new GMapTypeControl());
	//create randomnumber and retrieve xml file
	var randomnumber=Math.floor(Math.random()*11111)
    GDownloadUrl("data.xml?random="+randomnumber, function(data, responseCode) {
    var xml = GXml.parse(data);

	//store markers in markers array
    var markers = xml.documentElement.getElementsByTagName("marker");

	// create marker icon
	var icon = new GIcon();
	icon.image = "http://www.rt-tussenstation.nl/images/pijltje.png";
	icon.iconSize = new GSize(50, 50);
	icon.iconAnchor = new GPoint(20, 50);
	icon.infoWindowAnchor = new GPoint(5, 1);

	//loop over the markers array
    for (var i = 0; i < markers.length; i++) {
		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");
	  	map.addControl(new GMapTypeControl());
	  	map.setCenter(point, 10); // 14 is inzoom niveau
	  	var marker = createMarker(point,html,icon);
	  	map.addOverlay(marker);
    } //close for loop

	// add an encoded polyline
    var encodedPoints = "kot~Hmf{\\~JbO_BxNxAXc@jSUlEcBtECbK}BIgCwB";
    var encodedLevels = "BBBBBBBBBB";

    var encodedPolyline = new GPolyline.fromEncoded({
		color: "#FF0000",
		weight: 5,
		points: encodedPoints,
		levels: encodedLevels,
		zoomFactor: 32,
		numLevels: 4
	});

	//add polyline to map
	map.addOverlay(encodedPolyline);

	  }
	); //close GDownloadUrl
  } //close GBrowserIsCompatible
} //close load

  //Create marker and set up event window
  function createMarker(point,html,icon){
  	var marker = new GMarker(point,icon);
	GEvent.addListener(marker, "click", function() {
      marker.openInfoWindowHtml(html);
    });
	return marker;
  }

