var map;
function initializeGoogleMaps() {
  var myOptions = {
    zoom: 13,
    center: new google.maps.LatLng(52.599555, 4.714851),
    mapTypeId: google.maps.MapTypeId.ROADMAP
  }
  map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

  //var georssLayer = new google.maps.KmlLayer('http://www.ondernemendheiloo.nl/OndernemendHeiloo.asmx/GetBedrijven');
  //georssLayer.setMap(map);
  //setMarkers(map, beaches);
    $.ajax({
      type: "POST",
      url: "OndernemendHeiloo.asmx/GetBedrijven",
      contentType: "text/xml",
      dataType: "xml",
      beforeSend: function () {
        $(".loadingData").html("<p>Loading data..</p>");
      },
      complete: function () {
        $(".loadingData").html("");
      },
      cache: true,
      success: mapPoints,
      error: onError
    }); 
}
function onError(xhr, ajaxOptions, thrownError) {
  alert(xhr.status);
  alert(xhr.responseText);
}
function mapPoints(response) {
  if (response.childNodes[1] != null) {
    if (response.childNodes[1].childNodes.length > 0) {
      var image = new google.maps.MarkerImage('images/oh_googleicon.png',
      // This marker is 32 pixels wide by 35 pixels tall.
        new google.maps.Size(32, 35),
      // 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(300, 0)
      );
      var markers = response.documentElement.getElementsByTagName("marker");
      var infoWindow = new google.maps.InfoWindow;
      var html;
      for (var i = 0; i < markers.length; i++) {
        if (markers[i].getElementsByTagName("co_latitude")[0] != null && markers[i].getElementsByTagName("co_longitude")[0] != null) {
          var myLatLng = new google.maps.LatLng(markers[i].getElementsByTagName("co_latitude")[0].firstChild.nodeValue, markers[i].getElementsByTagName("co_longitude")[0].firstChild.nodeValue);
          html = '<b>' + markers[i].getElementsByTagName("co_name")[0].firstChild.nodeValue + '</b><br />' + markers[i].getElementsByTagName("co_address")[0].firstChild.nodeValue + '<br />' + markers[i].getElementsByTagName("co_postalcode")[0].firstChild.nodeValue + ' ' + markers[i].getElementsByTagName("co_city")[0].firstChild.nodeValue;
          if (markers[i].getElementsByTagName("co_phone") != null) {
            if (markers[i].getElementsByTagName("co_phone").length > 0) {
              html += '<br /><b>T</b>&nbsp;' + markers[i].getElementsByTagName("co_phone")[0].firstChild.nodeValue;
            }
          }
          if (markers[i].getElementsByTagName("co_fax") != null) {
            if (markers[i].getElementsByTagName("co_fax").length>0) {
              html += '<br /><b>F</b>&nbsp;' + markers[i].getElementsByTagName("co_fax")[0].firstChild.nodeValue;
            }
          }
          if (markers[i].getElementsByTagName("co_email") != null) {
            if (markers[i].getElementsByTagName("co_email").length > 0) {
              html += '<br /><b>M</b>&nbsp;<a href=mailto:' + markers[i].getElementsByTagName("co_email")[0].firstChild.nodeValue + '>' + markers[i].getElementsByTagName("co_email")[0].firstChild.nodeValue + '</a>';
            }
          }
          if (markers[i].getElementsByTagName("co_website") != null) {
            if (markers[i].getElementsByTagName("co_website").length > 0) {
              html += '<br /><b>W</b>&nbsp;<a href=http://' + markers[i].getElementsByTagName("co_website")[0].firstChild.nodeValue + '/ target=_blank>' + markers[i].getElementsByTagName("co_website")[0].firstChild.nodeValue + '</a>';
            }
          }
          var marker = new google.maps.Marker({
            position: myLatLng,
            map: map,
            icon: image,
            title: markers[i].getElementsByTagName("co_name")[0].firstChild.nodeValue
            //zIndex: i
          });
          bindInfoWindow(marker, map, infoWindow, html); 
        }
      }
    }
  }
}
function bindInfoWindow(marker, map, infoWindow, html) {
  google.maps.event.addListener(marker, 'click', function() {
    infoWindow.setContent(html);
    infoWindow.open(map, marker);
  });
}