标记未在XML文件中显示在谷歌地图上

时间:2015-11-04 00:16:07

标签: javascript html xml google-maps

因此,我尝试在Google地图上创建标记,并从数据库中查询lat / long并保存到XML文件中。我试图从XML文件中获取位置并使用新的Google标记,但无法在地图上显示任何标记。

我的HTML / JavaScript

rchisq(1000,df=4)

XML文件

//Test for markers
<!DOCTYPE html>
<html>
  <head>
    <style>
      #map {
        width: 1200px;
        height: 900px;
      }
    </style>
    <script src="https://maps.googleapis.com/maps/api/js"></script>   
    <script>
    var map;
      function initialize() { 
       var myLatlng = new google.maps.LatLng(38.0400, -122.7400);
        var mapOptions = {
          zoom: 10,
          center: myLatlng
        }
        map = new google.maps.Map(document.getElementById("map"), mapOptions);
      }
      loadMarkers();
      google.maps.event.addDomListener(window, 'load', initialize);

    function loadMarkers(){
        map.markers = map.markers || []
        downloadUrl("schools.xml", function(data) {
            var xml = data.responseXML;
            markers = xml.documentElement.getElementsByTagName("school");
            for(var i = 0; i < markers.length; i++){
                var name = markers[i].getAttribute("name");
                var point = new google.maps.LatLng(
                parseFloat(markers[i].getAttribute("lat")),
                parseFloat(markers[i].getAttribute("long")));
                var marker = new google.maps.Marker({
                    map:map,
                    position: point,
                    title:name
                });
                map.markers.push(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);
    }
    </script>
  </head>
  <body onload = "initialize()">
    <div id="map"></div>
  </body>
</html>

1 个答案:

答案 0 :(得分:0)

您的代码在此行中有一个javascript错误:Uncaught TypeError: Cannot read property 'markers' of undefined

    map.markers = map.markers || []

在定义地图之前,您正在调用loadMarkers。在初始化例程中调用它。

function initialize() { 
  var myLatlng = new google.maps.LatLng(38.0400, -122.7400);
  var mapOptions = {
    zoom: 10,
    center: myLatlng
  }
  map = new google.maps.Map(document.getElementById("map"), mapOptions);
  loadMarkers();
}