Блог

Главная - Вопросы по программированию - проблема в javascript

проблема в javascript

#javascript #html #xml

#javascript #HTML #xml

Вопрос:

Я использую следующий код, здесь я показываю адреса properties.xml с маркерами на карте Google. Это не выдает мне ошибки, но также ничего не отображает на карте Google.

Кто-нибудь может сказать мне, в чем проблема в моем коде?

properties.xml файл:

 <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-файл:

 <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=apiamp;v=2amp;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 файл:

     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);


   }

Ответ №1:

Я попробовал ваш код и получил отображение карт при первой загрузке, но произошла ошибка JS. Это была именно эта строка:

 address = address.firstChild.nodeValue;

Должно быть это, чтобы получить текст внутри <address> :

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

Вот часть карты, когда она работала:

Вот часть карты, которую я видел, когда она работала

Просто чтобы упомянуть, что сначала я не мог видеть никаких маркеров, поэтому я заменил:

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

с:

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

Не уверен, что это то, чего вы ожидали, но именно так все и получилось.

*ОБНОВИТЬ* Для создания маркера вы можете использовать эту функцию

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

Примените createMarker к map.addOverlay :

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

Комментарии:

1. я использовал значение дочернего узла вашего первого кода, но на карте ничего не отображается. но когда я попробовал ваш второй код для map.setCenter, все исчезло, только серое пустое поле

2. @ash вы просматриваете свою страницу на сервере или в виде локального файла? обязательно запустите его на сервере, чтобы избежать ограничений домена. также проверьте местоположение вашего XML, если оно правильное. Я смог увидеть загруженные карты, когда попробовал это, поэтому единственная проблема, которую мне пришлось исправить, — это ошибка JS.

3. я просматриваю на сервере. да, я вижу карту, загруженную при запуске кода, но на ней не отображаются адреса properties.xml файл на карте с маркером???

4. @ash у вас нет такой функциональности в вашем коде, потому что проблема заключалась в ошибке JS, верно? Я обновил свой ответ, чтобы создать простой маркер, который отображает адрес при нажатии, надеюсь, это поможет.