var i = 0;
    var side_bar_html = "";
    var n_buttonText="Map"; //Text that shows up on the button for the custom layer (n=normal, s=sat, h=hybrid)
    var s_buttonText="Satellite";
    var h_buttonText="Hybrid";
    var mapBounds=new GLatLngBounds(new GLatLng(27.638029728360287,-18.161043727926607),new GLatLng(43.791110866626816,4.329122325356836));
    var opacity=0.4;
    var map = null;
    var gmarkers = [];

   function customGetTileURL(a,b) {
      //converts tile x,y into keyhole string
      if (b>10) { return "google_maps/totaal/blank-tile.png"; };

      var c=Math.pow(2,b);
      var x=360/c*a.x-180;
      var y=180-360/c*a.y;
      var x2=x+360/c;
      var y2=y-360/c;
      var lon=x; //Math.toRadians(x); //would be lon=x+lon0, but lon0=0 degrees
      var lat=(2.0*Math.atan(Math.exp(y/180*Math.PI))-Math.PI/2.0)*180/Math.PI; //in degrees
      var lon2=x2;
      var lat2=(2.0*Math.atan(Math.exp(y2/180*Math.PI))-Math.PI/2.0)*180/Math.PI; //in degrees
      var tileBounds=new GLatLngBounds(new GLatLng(lat2,lon),new GLatLng(lat,lon2));

      if (!tileBounds.intersects(mapBounds)) { return "google_maps/totaal/blank-tile.png"; };
        var d=a.x;
        var e=a.y;
        var f="t";
        for(var g=0;g<b;g++){
            c=c/2;
            if(e<c){
                if(d<c){f+="q"}
                else{f+="r";d-=c}
            }
            else{
                if(d<c){f+="t";e-=c}
                else{f+="s";d-=c;e-=c}
            }
        }
 return "google_maps/totaal/"+f+".png"
    }

    function changeOpacity(op) {
	//this works as long as there are at least two map types
        var current=map.getCurrentMapType();
        if (current==map.getMapTypes()[0])
        	map.setMapType(map.getMapTypes()[1]);
	else
		map.setMapType(map.getMapTypes()[0]);
        opacity=op;
        map.setMapType(current); //was map.getMapTypes()[1]
    }


    function getWindowHeight() {
        if (window.self&&self.innerHeight) {
            return self.innerHeight;
        }
        if (document.documentElement&&document.documentElement.clientHeight) {
            return document.documentElement.clientHeight;
        }
        return 0;
    }

    function resizeMapDiv() {
        //Resize the height of the div containing the map.
        //Do not call any map methods here as the resize is called before the map is created.
    	var d=document.getElementById("map");
        var offsetTop=0;
        for (var elem=d; elem!=null; elem=elem.offsetParent) {
            offsetTop+=elem.offsetTop;
        }
        var height=getWindowHeight()-offsetTop-16;
        if (height>=0) {
            d.style.height=height+"px";
        }
    }





      function myclick(i) {
        GEvent.trigger(gmarkers[i], "click");
      }

	function load(x,y,nummer) {
		if (GBrowserIsCompatible()) {

        resizeMapDiv();
        
        var copyrightCollection = new GCopyrightCollection("GMapCreator");



        copyrightCollection.addCopyright(
          new GCopyright("CASA",
          new GLatLngBounds(new GLatLng(-90,-180), new GLatLng(90,180)),
          0,
          "<a href=\"http://www.casa.ucl.ac.uk\">CASA</a>")
        );

        //create a custom G_NORMAL_MAP layer
        var n_tileLayers = [ G_NORMAL_MAP.getTileLayers()[0], new GTileLayer(copyrightCollection , 0, 17)];
        n_tileLayers[1].getTileUrl = customGetTileURL;
        n_tileLayers[1].isPng = function() { return false; };
        n_tileLayers[1].getOpacity = function() { return opacity; };
        var n_customMap = new GMapType(n_tileLayers, new GMercatorProjection(n_tileLayers[0].maxResolution()+1), n_buttonText,
            {maxResolution:10, minResolution:0, errorMessage:"Data not available"});

        //create a custom G_SATELLITE_MAP layer
        var s_tileLayers = [ G_SATELLITE_MAP.getTileLayers()[0], new GTileLayer(copyrightCollection , 0, 17)];
        s_tileLayers[1].getTileUrl = customGetTileURL;
        s_tileLayers[1].isPng = function() { return false; };
        s_tileLayers[1].getOpacity = function() { return opacity; };
        var s_customMap = new GMapType(s_tileLayers, new GMercatorProjection(s_tileLayers[0].maxResolution()+1), s_buttonText,
            {maxResolution:10, minResolution:0, errorMessage:"Data not available"});
            
        //create a custom G_HYBRID_MAP layer
        var h_tileLayers = [ G_HYBRID_MAP.getTileLayers()[0], new GTileLayer(copyrightCollection , 0, 17),G_HYBRID_MAP.getTileLayers()[1]];
        h_tileLayers[1].getTileUrl = customGetTileURL;
        h_tileLayers[1].isPng = function() { return false; };
        h_tileLayers[1].getOpacity = function() { return opacity; };
        var h_customMap = new GMapType(h_tileLayers, new GMercatorProjection(h_tileLayers[0].maxResolution()+1), h_buttonText,
            {maxResolution:10, minResolution:0, errorMessage:"Data not available"});

        //Now create the custom map. Would normally be G_NORMAL_MAP,G_SATELLITE_MAP,G_HYBRID_MAP
	
        map = new GMap2(document.getElementById("map"),{mapTypes:[n_customMap,s_customMap,h_customMap]});
        map.addControl(new GLargeMapControl());
	map.addControl(new GMapTypeControl());
        map.addControl(new GOverviewMapControl());
        map.enableContinuousZoom();
        map.enableScrollWheelZoom();

        map.setCenter(new GLatLng(x, y), 9, n_customMap);
        map.addControl(new DragZoomControl());               
        map.addControl(new GScaleControl()); 
        map.checkResize();




		  var request = GXmlHttp.create();
		  var temp = "http://www.vacation2spain.com/" + nummer + ".xml";
		  request.open("GET", temp, 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 lat = parseFloat(markers[i].getAttribute("lat"));
				var lng = parseFloat(markers[i].getAttribute("lng"));
				var point = new GLatLng(lat,lng);
				var name = markers[i].getAttribute("name");
				var pop08 = markers[i].getAttribute("pop08");
				var surface= markers[i].getAttribute("surface");
				var municipality_link = markers[i].getAttribute("municipality_link");
				var marker = createMarker(point,name,pop08,surface,municipality_link);
				map.addOverlay(marker);
			  }
			}
		  }
		  request.send(null);
		  
		  function createMarker(point,name,pop08,surface,municipality_link) {
			var markerhtml = "";
			if (name != "") markerhtml += "Name: <b>" + name + "</b><br>";
			if (pop08 != "") markerhtml += "Population: <b>" + pop08 + "</b><br>";
			if (surface != "") markerhtml += "Land area: <b>" + surface + " km2 </b><br><br>";
			if (municipality_link != "") markerhtml += "Link: <a target=\"_blank\" href=\"" + municipality_link + "\">" + name + "</a>";	

			var marker = new GMarker(point);

			GEvent.addListener(marker, "click", function() {
			  marker.openInfoWindowHtml(markerhtml);
			});

			gmarkers[i] = marker;
			        side_bar_html += '<a href="javascript:myclick(' + i + ')">' + name + '</a><br>';
		      document.getElementById("side_bar").innerHTML = side_bar_html;

			i++;
return marker;
		  }
		}
		else {
		  alert("Sorry, the Google Maps API is not compatible with this browser");
		}
	}
    //]]>