Question

am learning javascript and not at a great rate, am trying to use the code to create a google map v3 api with searchable locations which load from an xml file.

Ran into a problem, many infact, but here is this one: I can not access the data in the xml file, i have used an example and tried to adjust it via reading and trying different code but to no success.

It is not accessing the data using my xml file, this is my xml format with the js code below:

    <markers style="MEDIUM">
       <marker>
         <title>McDonalds</title>
         <lat>55.5452</lat>
         <lng>34.3755</lng>
         <markerId>0</markerId>
         <countryCode>GB</countryCode>
         <address>Somewhere in London</address>
         <description>Get a free toy with every happy meal!</description>
       </marker>
    </markers>

This is the JS from my html file.

downloadUrl("london.xml", function(doc) {
            var xmlDoc = xmlParse(doc);
            var markers = xmlDoc.documentElement.getElementsByTagName("marker");

            for (var i = 0; i < markers.length; i++) {
             // obtain the attribues of each marker
              var lat = parseFloat(markers[i].getElementsByTagName("lat"));
              var lng = parseFloat(markers[i].getElementsByTagName("lng"));
              var point = new google.maps.LatLng(lat,lng);

              var description = markers[i].getElementsByTagName("description");
              var title = markers[i].getElementsByTagName("title");
          alert(title);
              // create the marker
              var marker = createMarker(point,title,description);
            }
        alert(i);

I imagine it is something very simple such as linking the nodes, but I can not figure it out and thought some help or advice would save me some sanity, thanks guys.

Answer 1

Well, it is hard to say definitely where all the problems are… However, the first problem I can see is that you are trying to getElementsByTagName from documentElement but you need to take it from xmlDoc:

var markers = xmlDoc.getElementsByTagName("marker");

Then, you are trying to convert NodeList object to float. It should be redone to:

var lat = parseFloat(markers[i].getElementsByTagName("lat")[0].textContent);
var lng = parseFloat(markers[i].getElementsByTagName("lng")[0].textContent);

Next, I believe description and title are stored in the textContent of the first nodes with the corresponding names. So,

var description = markers[i].getElementsByTagName("description")[0].textContent;
var title = markers[i].getElementsByTagName("title")[0].textContent;

And don’t forget to check the right format of your XML file (including <?xml ...?> header, etc.)