var map;

// met deze functie creer je een marker(pin) en voor iconImage geef je een url van het gewenste plaatje
function createMarker(myMarker) {
var gmapItemInfo = '<table>'+
'<tr><td><span class="kop_zwart"><b>'+myMarker.naam+'</b></span></td></tr>'+
'<tr><td><span class="kop_zwart">'+myMarker.adres+'</span></td></tr>'+
'<tr><td><span class="kop_zwart">'+myMarker.postcode+'</span></td></tr>'+
'<tr><td><span class="kop_zwart">'+myMarker.plaats+'</span></td></tr>'+
'</table>';
	var gmapCatInfo = '<form action="http://www.cognito-it.com/routeplanner/route_digisport.php" method="GET" target="new"><br><span class="kop_zwart">Type hier uw straat en woonplaats<br> voor een routebeschrijving:</span><br><br><input type="text" onclick="this.value=\'\';" name="from" value="<straat>,<plaats>"><br><br><input type="submit" value="bereken route"><input type="hidden" name="to" value="'+myMarker.adres+','+myMarker.plaats+'"></form>';
	var infoTabs = [
		new GInfoWindowTab('adres', gmapItemInfo),
		new GInfoWindowTab('route', gmapCatInfo)
   ];
	if(myMarker.picurl!=''){
		var icon = new GIcon();
		icon.image = myMarker.picurl;
		icon.iconSize = new GSize(19, 19);
		icon.iconAnchor = new GPoint(12, 12);
		icon.infoWindowAnchor = new GPoint(14, 14);
		var marker = new GMarker(new GLatLng(myMarker.latitude, myMarker.longitude),icon);
	} else {
	var marker = new GMarker(new GLatLng(latitude, longitude));
	}
	// hier maak je de marker aanklikbaar en laat je een infoscherm openen met een beschrijving
		GEvent.addListener(marker, 'click',
					   function() {
						   marker.openInfoWindowTabsHtml(infoTabs);
					   }
					   );
//Style kopjes aanpassen
GEvent.addListener(map, "infowindowopen", function() {
var divs = map.getContainer().getElementsByTagName("div");
for(var i = 0; i<divs.length; i++) {
var height = divs[i].style.height;
var width = divs[i].style.width;
if(width=="103px"&&height=="24px") {
var newLabel = divs[i].innerHTML;
var newText = '<a href="#" class="extern_zwart">' + newLabel + '</a>';
divs[i].innerHTML = newText;

}}}); 

	// hier plaats je daadwerkelijk de marker
	map.addOverlay(marker);
	// open de ballon meteen (werkt niet goed)
         marker.openInfoWindowTabsHtml(infoTabs); 
        //return marker;
}
// functie voor het zoomen met het scrollwiel
function wheelZoom(a)
{ (a.detail || -a.wheelDelta) < 0 ? map.zoomIn() : map.zoomOut(); }



function init() {
    if (GBrowserIsCompatible()) {	
        map = new GMap2(document.getElementById("map"));
        map.addControl(new GSmallZoomControl());
        map.addControl(new GMapTypeControl());
        map.setCenter(new GLatLng(centerLatitude, centerLongitude), startZoom);

      //////////////////////////////////////////////////////////////////////
      // nodig voor het zoomen met het scrollwiel en zoomen met dubbelklik
      //////////////////////////////////////////////////////////////////////
      var mapobj = document.getElementById("map");
      map.enableContinuousZoom();
      map.enableDoubleClickZoom();
      GEvent.addDomListener(mapobj, "DOMMouseScroll", wheelZoom);
      GEvent.addDomListener(mapobj, "mousewheel", wheelZoom); 
      //////////////////////////////////////////////////////////////////////

        for (var id=0;id<markers.length;id++) {
		createMarker(markers[id]);
	}

}
}

window.onload = init;
window.onunload = GUnload;