title: Drawing multiple Polygons on Google Maps API V3 from XML File
body: <p>I actual draw a map with multiple marker which are parsed from an XML File. Addionally I draw two Polyglons on my map. The Coords are hard-coded in the script and I want to load the polyglon coords from an XML-File as well. Here is my actual Code:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  
  var customIcons = {
  warning: {
  icon: 'https://scoo.me/img/marker_warning.png'
  },
  activate: {
  icon: 'https://scoo.me/img/marker_activate.png'
  }
  };
  
  function load() {
  var map = new google.maps.Map(document.getElementById("map"), {
  zoom: 12,
  scrollwheel: false,
  mapTypeId: 'roadmap',
  mapTypeControl: false
  });
  
  var infoWindow = new google.maps.InfoWindow;
  downloadUrl("../xml/vehicles_service_required.php", function(data) {';
  var xml = data.responseXML;
  var markers = xml.documentElement.getElementsByTagName("marker");
  var bounds = new google.maps.LatLngBounds();
  for (var i = 0; i &lt; markers.length; i++) {
    var VehicleID = markers[i].getAttribute("VehicleID");
    var VehicleLabel = markers[i].getAttribute("VehicleLabel");
    var ServiceRequired = markers[i].getAttribute("ServiceRequired");
    var point = new google.maps.LatLng(
        parseFloat(markers[i].getAttribute("lat")),
        parseFloat(markers[i].getAttribute("lng")));
    bounds.extend(point);
    var html = "&lt;b&gt;Roller-Nr. " + VehicleLabel + "&lt;/b&gt; &lt;br/&gt;(ID-" + VehicleID + ")";
    var icon = 'https://scoo.me/img/marker_activate.png';
    //var icon = {};
    if (ServiceRequired == "0") {
      icon = 'https://scoo.me/img/marker_warning.png';
    } else if (ServiceRequired == "-1") {
      icon = 'https://scoo.me/img/marker_activate.png';     
    }
  
    var marker = new google.maps.Marker({
      map: map,
      position: point,
      //icon: 'https://scoo.me/img/marker_warning.png'
      icon: icon
    });
    bindInfoWindow(marker, map, infoWindow, html);
  }
  map.fitBounds(bounds);
  
  // Polyglon Munich
  
  var muenchen = new google.maps.Polygon({
              paths: [
              new google.maps.LatLng(48.163108,11.588816),
              new google.maps.LatLng(48.169462,11.595339),
              new google.maps.LatLng(48.173069,11.599073),
              new google.maps.LatLng(48.176016,11.592807),
              new google.maps.LatLng(48.182455,11.599373)],
              strokeColor: '#21a9e1',
              strokeOpacity: 0.8,
              strokeWeight: 2,
              fillColor: '#21a9e1',
              fillOpacity: 0.2,
              map: map
          });
  
  // Geschäftsgebiet Cologne
          var koeln = new google.maps.Polygon({
              paths: [
              new google.maps.LatLng(50.9558045,6.9741296),
              new google.maps.LatLng(50.9567777,6.9755029),
              new google.maps.LatLng(50.9579266,6.9736361),
              new google.maps.LatLng(50.9574265,6.9724559),
              new google.maps.LatLng(50.9596701,6.9679069),
              new google.maps.LatLng(50.9600215,6.9656538)],
              strokeColor: '#21a9e1',
              strokeOpacity: 0.8,
              strokeWeight: 2,
              fillColor: '#21a9e1',
              fillOpacity: 0.2,
              map: map
          });
    });
  }
  
  function bindInfoWindow(marker, map, infoWindow, html) {
  google.maps.event.addListener(marker, 'click', function() {
  infoWindow.setContent(html);
  infoWindow.open(map, marker);
  });
  }
  
  function downloadUrl(url, callback) {
  var request = window.ActiveXObject ?
  new ActiveXObject('Microsoft.XMLHTTP') :
  new XMLHttpRequest;
  
  request.onreadystatechange = function() {
  if (request.readyState == 4) {
    request.onreadystatechange = doNothing;
    callback(request, request.status);
  }};
  
  request.open('GET', url, true);
  request.send(null);
  }
  
  function doNothing() {}
  
  &lt;/script&gt;
  </code></pre>
  
  <p>And my XML for Polgon is looking like:</p>
  
  <pre><code>&lt;subdivisions&gt;
      &lt;subdivision Name="Muenchen"&gt;
          &lt;coord lat="48.163108" lng="11.588816"/&gt;
          &lt;coord lat="48.169462" lng="11.595339"/&gt;
          &lt;coord lat="48.173069" lng="11.599073"/&gt;
          &lt;coord lat="48.176016" lng="11.592807"/&gt;
          &lt;coord lat="48.182455" lng="11.599373"/&gt;
      &lt;/subdivision&gt;
      &lt;subdivision Name="Koeln"&gt;
          &lt;coord lat="50.9558045" lng="6.9741296"/&gt;
          &lt;coord lat="50.9567777" lng="6.9755029"/&gt;
          &lt;coord lat="50.9579266" lng="6.9736361"/&gt;
          &lt;coord lat="50.9574265" lng="6.9724559"/&gt;
          &lt;coord lat="50.9596701" lng="6.9679069"/&gt;
          &lt;coord lat="50.9600215" lng="6.9656538"/&gt;
          &lt;coord lat="50.9627245" lng="6.9615983"/&gt;
          &lt;coord lat="50.9651706" lng="6.9538736"/&gt;
          &lt;coord lat="50.9664139" lng="6.9517493"/&gt;
      &lt;/subdivision&gt;
  &lt;/subdivisions&gt;
  </code></pre>
  
  <p>Can anybody please give me an example how to implement the XML for polyglone in my script. Thank you in advance!</p>