//<![CDATA[

    var iconBlue = new GIcon(); 
    iconBlue.image = 'pins/kayak7.png';
    iconBlue.iconSize = new GSize(32, 37);
    iconBlue.iconAnchor = new GPoint(8, 32);
    iconBlue.infoWindowAnchor = new GPoint(24, 20);

    var iconRed = new GIcon(); 
    iconRed.image = 'pins/kayak3.png';
    iconRed.iconSize = new GSize(32, 37);
    iconRed.iconAnchor = new GPoint(8, 32);
    iconRed.infoWindowAnchor = new GPoint(24, 20);

    var iconGreen = new GIcon(); 
    iconGreen.image = 'pins/kayak2.png';
    iconGreen.iconSize = new GSize(32, 37);
    iconGreen.iconAnchor = new GPoint(8, 32);
    iconGreen.infoWindowAnchor = new GPoint(24, 20);

    var iconOrange = new GIcon(); 
    iconOrange.image = 'pins/kayak4.png';
    iconOrange.iconSize = new GSize(32, 37);
    iconOrange.iconAnchor = new GPoint(8, 32);
    iconOrange.infoWindowAnchor = new GPoint(24, 20);

    var iconYellow = new GIcon(); 
    iconYellow.image = 'pins/kayak8.png';
    iconYellow.iconSize = new GSize(32, 37);
    iconYellow.iconAnchor = new GPoint(8, 32);
    iconYellow.infoWindowAnchor = new GPoint(24, 20);
	
	var iconClub = new GIcon(); 
    iconClub.image = 'pins/kayak5.png';
    iconClub.iconSize = new GSize(32, 37);
    iconClub.iconAnchor = new GPoint(8, 32);
    iconClub.infoWindowAnchor = new GPoint(24, 20);
	
	var iconEvens = new GIcon(); 
    iconEvens.image = 'pins/event.png';
    iconEvens.iconSize = new GSize(32, 37);
    iconEvens.iconAnchor = new GPoint(8, 32);
    iconEvens.infoWindowAnchor = new GPoint(24, 20);

    var iconCamp = new GIcon(); 
    iconCamp.image = 'pins/tent.png';
    iconCamp.iconSize = new GSize(32, 37);
    iconCamp.iconAnchor = new GPoint(8, 32);
    iconCamp.infoWindowAnchor = new GPoint(24, 20);
	
	var iconGps = new GIcon(); 
    iconGps.image = 'pins/gps.png';
    iconGps.iconSize = new GSize(32, 37);
    iconGps.iconAnchor = new GPoint(8, 32);
    iconGps.infoWindowAnchor = new GPoint(24, 20);
	
    var customIcons = [];
    customIcons["kanosteigers"] = iconGreen;
    customIcons["kano"] = iconBlue;
    customIcons["kajak"] = iconRed;
    customIcons["kanoverhuur"] = iconOrange;
    customIcons["kanowinkels"] = iconYellow;
    customIcons["kanocampings"] = iconCamp;
    customIcons["clubs"] = iconClub;
	customIcons["evens"] = iconEvens;
	customIcons["gps"] = iconGps;
    var markerGroups = { "kanosteigers": [], "kano": [], "kajak": [], "kanoverhuur": [], "kanowinkels": [], "kanocampings": [], "clubs": [], "evens": [], "gps": []};

    function load() {
      if (GBrowserIsCompatible()) {
        var map = new GMap2(document.getElementById("map"));
        map.addControl(new GSmallMapControl());
        map.addControl(new GMapTypeControl());
	map.enableScrollWheelZoom(); 
        map.setCenter(new GLatLng(52.23621,5.339355), 9);


        // Change this depending on the name of your PHP file
        GDownloadUrl("phpsqlajax_genxml3.php", function(data) {
          var xml = GXml.parse(data);
          var markers = xml.documentElement.getElementsByTagName("marker");
          for (var i = 0; i < markers.length; i++) {
            var titel = markers[i].getAttribute("titel");
            var logo = markers[i].getAttribute("logo");
            var oms = markers[i].getAttribute("oms");
            var door = markers[i].getAttribute("door");
            var web = markers[i].getAttribute("web");
            var land = markers[i].getAttribute("land");
            var prov = markers[i].getAttribute("prov");
            var type = markers[i].getAttribute("type");
            var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
                                    parseFloat(markers[i].getAttribute("lng")));
            var marker = createMarker(point, titel, logo, oms, door, web, land, prov, type);
            map.addOverlay(marker);
            marker.show();
          }
        });
      }
    }

    function createMarker(point, titel, logo, oms, door, web, land, prov, type) {
      var marker = new GMarker(point, customIcons[type]);
      markerGroups[type].push(marker);
      var html = '<div style="width:240px">'+ '<img src="' + logo + '" alt="pic" class="left" />' + " " + "<b>" + titel + "</b> <br/>" + oms + "<br/>" + '<a href="http://' + door + '" target="_blank">' + "directe link" + '</a>' + "<br/>" + '<a href="http://' + web + '" target="_blank">' + web + '</a>' + '</div>';
      GEvent.addListener(marker, 'click', function() {
        marker.openInfoWindowHtml(html);
      });
      return marker;
    }
    function toggleGroup(type) {
      for (var i = 0; i < markerGroups[type].length; i++) {
        var marker = markerGroups[type][i];
        if (marker.isHidden()) {
          marker.show();
        } else {
          marker.hide();
        }
      } 
    }
    //]]>