problem in javascript

Question

I am using the following code ,here I am showing addresses of properties.xml with markers on google map. It gives me no error but also displaying nothing on google map.

Can anybody tell me where is the problem in my code?

properties.xml file:

<properties>
<property>
<type>apartment</type>
<address>538 Little Lonsdale Street,Melbourne,VIC </address>
</property>
<property>
<type>apartment</type>
<address>196 Little Lonsdale Street,Melbourne,VIC</address>
</property>
<property>
<type>apartment</type>
<address>5/5 Close Ave,Dandenong,VIC </address>
</property>
</properties>

html file:

<html xmlns="http://www.w3.org/1999/xhtml" > 
<head> 
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>property</title> 
<script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAB1CHU9LrppxpqwUwaxkvTBRIez7zTAJDrX7CdEV86wzEyVzTHBQKDxL9qiopaHZkOJ8F2t0RQW9W8A"
      type="text/javascript"></script>
<script type="text/javascript" src="map.js"></script> 
</head>

<body onload="load()" onunload="GUnload()">

<div id="map" style="width: 500px; height: 400px"></div>

</body>
</html>

map.js file:

    var map;
    var geocoder;
    var xml;
    var property;
    var address;

   function load()
   {

      map = new GMap2(document.getElementById("map"));        
     map.setCenter(new GLatLng(-24.994167,134.866944), 4);

      map.addControl(new GSmallMapControl());
      map.addControl(new GMapTypeControl());
      geocoder = new GClientGeocoder();

      GDownloadUrl("../../data/properties.xml", function(data) {
          xml = GXml.parse(data);
          property = xml.documentElement.getElementsByTagName("property");
          for (var i = 0; i < property.length; i++) {
            address = property[i].getElementsByTagName("address");
            address = address.firstChild.nodeValue;

           geocoder.getLocations(address, addToMap);}
        });   
   }


   function addToMap(response)
   {

      place = response.Placemark[0];

      point = new GLatLng(place.Point.coordinates[1],
                          place.Point.coordinates[0]);

      marker = new GMarker(point);
      map.addOverlay(marker);


   }

tradyblix · Accepted Answer · 2011-05-14 01:29:41Z

1

I tried your code and got the maps displaying on first load but there was a JS error. It was this particular line:

address = address.firstChild.nodeValue;

Should be this to get the text inside <address>:

address = address[0].childNodes[0].nodeValue;

Here is a portion of the map when it worked:

Here is a portion of the map that I saw when it worked

Just to mention that I couldn't see any markers at first so I replaced:

map.setCenter(new GLatLng(37.997022, -122.6), 11);

with:

map.setCenter(bounds.getCenter(), map.getBoundsZoomLevel(bounds));

Not sure if that's what you're expecting but that's how it turned out.

*UPDATE* To create a marker you can use this function

function createMarker(point, address)
{
   var marker = new GMarker(point);
   GEvent.addListener(marker, "click", function() {
   map.openInfoWindowHtml(point, address);
   });
   return marker;
}

Apply the createMarker to map.addOverlay:

map.addOverlay(createMarker(point, response.name));

edited May 14, 2011 at 1:29

answered May 14, 2011 at 0:31

tradyblix

7,5843 gold badges27 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

ash Over a year ago

i used ur first code childnode value ,but nothing appear on map. but when i tried ur second code for map.setCenter , everything disappear just grey color empty box

tradyblix Over a year ago

@ash are you viewing your page on a server or as a local file? make sure to run it in a server to avoid domain restrictions. also check the location of your XML if it's correct. I was able to see the maps loaded when I tried it so the only problem I had to fix is the JS error.

ash Over a year ago

i am viewing on a server.yes i can see the map loaded when i am running the code but it doesnt show addresses of properties.xml file on a map with marker???

tradyblix Over a year ago

@ash you don't have that functionality in your code because the issue was the JS error, right? I updated my answer to create a simple marker that displays the address on click, hope that helps.

Collectives™ on Stack Overflow

problem in javascript

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related