title: Loading Markers from XML file to Google Map API
body: <p>my goal is to be able to load markers from an sql database and display them on a googlemap. but im having a hard time just trying to read markers from an xml file.</p>
  
  <p>Here is my HTML file</p>
  
  <pre><code>  &lt;!DOCTYPE html&gt;
  &lt;html&gt;
    &lt;head&gt;
      &lt;title&gt;Simple Map&lt;/title&gt;
      &lt;meta name="viewport" content="initial-scale=1.0, user-scalable=no"&gt;
      &lt;meta charset="utf-8"&gt;
      &lt;style&gt;
  
        html, body, #map-canvas 
        {
          height: 100%; 
          margin: 0px;
          padding: 0px
        }
      &lt;/style&gt;
      &lt;script src="https://maps.googleapis.com/maps/api/js?v=3.exp&amp;sensor=false&amp;libraries=places"&gt;&lt;/script&gt;
      &lt;script&gt;
  
  
              function initialize() 
              {
  
                var mapOptions = 
                {
                  zoom: 12,
                  center:new google.maps.LatLng(53.3478, -6.2597)//center over dublin
                };
  
              var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
  
              }
  
              function loadXMLFile(){
              var filename = 'markers.xml';
              $.ajax({
                  type: "GET",
                  url: filename ,
                  dataType: "xml",
                  success: parseXML,
                  error : onXMLLoadFailed
              });
  
              function onXMLLoadFailed(){
              alert("An Error has occurred.");
              }
  
              function parseXML(xml){
              container = new nokia.maps.map.Container();
              $(xml).find("marker").each(function(){
                  //Read the name, address, latitude and longitude for each Marker
                  var nme = $(this).find('name').text();
                  var address = $(this).find('address').text();
                  var lat = $(this).find('lat').text();
                  var lng = $(this).find('lng').text();
                  var markerCoords = new nokia.maps.geo.Coordinate
                      (parseFloat(lat), parseFloat(lng));    
                  container.objects.add(new nokia.maps.map.StandardMarker(
                      markerCoords, {text:nme}));      
  
              });
              map.objects.add(container);
              map.zoomTo(container.getBoundingBox(), false);
          }
  
  
  }
              google.maps.event.addDomListener(window, 'load', initialize);
      &lt;/script&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;div id="map-canvas"&gt;&lt;/div&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>and this is my xml file</p>
  
  <pre><code>&lt;?xml version="1.0"?&gt;
  &lt;markers&gt;
      &lt;marker&gt;
           &lt;name&gt;M1&lt;/name&gt;
           &lt;address&gt;Abbey Street&lt;/address&gt;
           &lt;lat&gt;53.3496&lt;/lat&gt;
           &lt;lng&gt;-6.257&lt;/lng&gt;
     &lt;/marker&gt;
     &lt;/markers&gt;
  </code></pre>
  
  <p>The map is rendering but no marker is appearing on the map. I have google searched this problem but cant find anything that helps. </p>