//<![CDATA[

    function initialize() {
      if (GBrowserIsCompatible()) {
        // define the crosshair tile layer and its required functions
        var crossLayer = new GTileLayer(new GCopyrightCollection(""), 0, 15);
        crossLayer.getTileUrl =  function(tile, zoom) {
          return "./include/tile_crosshairs.png";
        }
        crossLayer.isPng = function() {return true;}

        // Create a new map type incorporating the tile layer
        var layerTerCross = [ G_PHYSICAL_MAP.getTileLayers()[0],
                              crossLayer ];
        var mtTerCross = new GMapType(layerTerCross,
                                      G_PHYSICAL_MAP.getProjection(), "Ter+");

        var map = new GMap2(document.getElementById("map_canvas"),
            { size: new GSize(837,500) } );
        map.addMapType(G_PHYSICAL_MAP);
        map.addMapType(mtTerCross);
        map.setCenter(new GLatLng(43.294722, 16.848333), 10);
        map.addControl(new GLargeMapControl());
		map.addMapType(G_HYBRID_MAP);
		map.setMapType(G_HYBRID_MAP);
		
	  // A function to create the marker and set up the event window
      // Dont try to unroll this function. It has to be here for the function closure
      // Each instance of the function preserves the contends of a different instance
      // of the "marker" and "html" variables which will be needed later when the event triggers.    
      function createMarker(point,html) {
        var marker = new GMarker(point);
        GEvent.addListener(marker, "click", function() {
          marker.openInfoWindowHtml(html);
        });
        
		 // The new marker "mouseover" listener        
        GEvent.addListener(marker,"mouseover", function() {
          marker.openInfoWindowHtml(html);
        });  
		
		return marker;		
      }
		
		var point = new GLatLng(43.174517, 16.427833);
		var content = '<div id="mapa_content"><h3>Diving center Viking</h3><img border="0" src="../pic/howto-center.jpg"><\/div>';
      var marker = createMarker(point, content)
      map.addOverlay(marker);


        var mapControl = new GHierarchicalMapTypeControl();
        
        // Set up map type menu relationships
        mapControl.clearRelationships();
        mapControl.addRelationship(G_SATELLITE_MAP, G_HYBRID_MAP, "Labels", false);
        mapControl.addRelationship(G_PHYSICAL_MAP, mtTerCross, "Crosshairs");
  
        // Add control after you've specified the relationships
        map.addControl(mapControl);
      }
    }
    //]]>