//<![CDATA[

    if (GBrowserIsCompatible()) {

      // create the map
      var map = new GMap2(document.getElementById("map"),{size:new GSize(420,400),mapTypes:[G_NORMAL_MAP]});
      map.addControl(new GLargeMapControl());
      map.addControl(new GMapTypeControl());
	  
      // ==== It is necessary to make a setCenter call of some description before adding markers ====
      // ==== At this point we dont know the real values ====
      map.setCenter(new GLatLng(0,0),0);   
      
      // ===== Start with an empty GLatLngBounds object =====     
      var bounds = new GLatLngBounds();	  
	  
      var side_bar_html = "";
      var gmarkers = [];
      var htmls = [];
      var i = 0;

	  side_bar_html = '<SPAN STYLE="color: #000000; font-weight: bold; text-decoration: none">' + provinceName + '</SPAN><BR>';

      // A function to create the marker and set up the event window
      function createMarker(point,name,html) {
        var marker = new GMarker(point);
        GEvent.addListener(marker, "click", function() {
          marker.openInfoWindowHtml(html);
        });
        gmarkers[i] = marker;
        htmls[i] = html;
        side_bar_html += '<a href="javascript:myclick(' + i + ')">' + name + '<\/a><br>';
        i++;
        return marker;
      }

      function myclick(i) {
        gmarkers[i].openInfoWindowHtml(htmls[i]);
      }

      // Read the data from an XML file
      GDownloadUrl(xmlfilename, function (doc) {
        var xmlDoc = GXml.parse(doc);
        var markers = xmlDoc.documentElement.getElementsByTagName("marker");
          
        for (var i = 0; i < markers.length; i++) {
          // obtain the attributes 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");
          // create the marker
          var marker = createMarker(point,label,html);
          map.addOverlay(marker);
		  
            // ==== Each time a point is found, extent the bounds to include it =====
            bounds.extend(marker.getPoint());		  
        }
        
		  document.getElementById("side_bar").innerHTML = side_bar_html;
		
          // ===== determine the zoom level from the bounds =====
          map.setZoom(map.getBoundsZoomLevel(bounds));

          // ===== determine the centre from the bounds ======
          map.setCenter(bounds.getCenter());
		  
		  var minMapScale = 4;
		  var maxMapScale = 10;
		  
		  // get array of map types
		  var mapTypes = map.getMapTypes();
		  
		  // overwrite the getMinimumResolution() and getMaximumResolution() methods for each map type
		  for (var i=0; i<mapTypes.length; i++) {
		  	mapTypes[i].getMinimumResolution = function() {return minMapScale;}
			mapTypes[i].getMaximumResolution = function() {return maxMapScale;}
		  }

      		// Add a move listener to restrict the bounds range
      		GEvent.addListener(map, "move", function() {
        		checkBounds();
			});

      		// The allowed region which the whole map must be within
      		var allowedBounds = new GLatLngBounds(new GLatLng(leftBoundLat,leftBoundLng), new GLatLng(rightBoundLat,rightBoundLng));
      
      		// If the map position is out of range, move it back
      		function checkBounds() {
        		// Perform the check and return if OK
        		if (allowedBounds.contains(map.getCenter())) {
          			return;
        		}
        
				// It`s not OK, so find the nearest allowed point and move there
        		var C = map.getCenter();
        		var X = C.lng();
        		var Y = C.lat();

        		var AmaxX = allowedBounds.getNorthEast().lng();
        		var AmaxY = allowedBounds.getNorthEast().lat();
        		var AminX = allowedBounds.getSouthWest().lng();
        		var AminY = allowedBounds.getSouthWest().lat();

        		if (X < AminX) {X = AminX;}
        		if (X > AmaxX) {X = AmaxX;}
        		if (Y < AminY) {Y = AminY;}
        		if (Y > AmaxY) {Y = AmaxY;}
        	
				//alert ("Restricting "+Y+" "+X);
        		map.setCenter(new GLatLng(Y,X));
      		}
		
      });
    }

    else {
      alert("Sorry, the Google Maps API is not compatible with this browser");
    }

    //]]>