function initialize()
	 {
		var myOptions = {
			zoom: 10,
			center: new google.maps.LatLng(-33.9, 151.2),
			mapTypeId: google.maps.MapTypeId.ROADMAP
		}
		var map = new google.maps.Map(document.getElementById("map"),
        myOptions);


		setMarkers(map, beaches);
	}


	var beaches = [
		['Bondi Beach', -33.890542, 151.274856, 4],
		['Coogee Beach', -33.923036, 151.259052, 5],
		['Cronulla Beach', -34.028249, 151.157507, 3],
		['Manly Beach', -33.80010128657071, 151.28747820854187, 2],
		['Maroubra Beach', -33.950198, 151.259302, 1]
	];


	function setMarkers(map, locations)
	{
		var image = new google.maps.MarkerImage('startpuntMini.png',
		// This marker is 20 pixels wide by 32 pixels tall.
		new google.maps.Size(24, 23),
		// The origin for this image is 0,0.
		new google.maps.Point(0,0),
		// The anchor for this image is the base of the flagpole at 0,32.
		new google.maps.Point(0, 23));
		var shadow = new google.maps.MarkerImage('images/beachflag_shadow.png',
		// The shadow image is larger in the horizontal dimension
		// while the position and offset are the same as for the main image.
		new google.maps.Size(37, 32),
		new google.maps.Point(0,0),
		new google.maps.Point(0, 32));
		// Shapes define the clickable region of the icon.
		// The type defines an HTML <area> element 'poly' which
		// traces out a polygon as a series of X,Y points. The final
		// coordinate closes the poly by connecting to the first
		// coordinate.
		
		var name = '';
		for (var i = 0; i < locations.length; i++) {
			var beach = locations[i];
			var myLatLng = new google.maps.LatLng(beach[1], beach[2]);
			var marker = new google.maps.Marker({
				position: myLatLng,
				map: map,
				icon: image,
				title: beach[0],
			});
			
			var boxText = document.createElement("div");
			boxText.style.cssText = "border: 1px solid black; color: #000; margin-top: 8px; background: white; padding: 5px;";
			boxText.innerHTML = "City Hall, Sechelt<br>British Columbia<br>Canada";
                
			var myOptions =
			{
                 content: boxText
                ,disableAutoPan: false
                ,maxWidth: 0
                ,pixelOffset: new google.maps.Size(-140, 0)
                ,zIndex: null
                ,boxStyle: { 
					width: "280px"
					,color: "#000;" 
                 }
                ,closeBoxMargin: "10px 2px 2px 2px"
                ,closeBoxURL: "http://www.google.com/intl/en_us/mapfiles/close.gif"
                ,infoBoxClearance: new google.maps.Size(1, 1)
                ,isHidden: false
                ,pane: "floatPane"
                ,enableEventPropagation: false
			};


			var ib = new InfoBox(myOptions);
			ib.open(map, marker);
		}
	}