无法读取属性'responseXML'Google Map

时间:2018-04-04 09:11:19

标签: javascript xml google-maps google-maps-api-3 google-maps-markers

使用Google Chorme(最新版本)& Sublime Text。

您好我的个人项目,我想将xml坐标(公共汽车)转换为谷歌地图上的标记,这是我的代码:

<script type="text/javascript">

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
        initMap(this);
    }
};
xhttp.open("GET", "https://applications002.brest-metropole.fr/WIPOD01/Transport/REST/getGeolocatedVehiclesPosition?format=xml&route_id=1&trip_headsign=Fort%20Montbarey", true);
xhttp.send();

function initMap(xml){
var xlat, xlon, inc, xmlDoc, GeoBus, marker;
xmlDoc = xml.responseXML; //line 48
xlat = xmlDoc.getElementsByTagName('Lat');
xlon = xmlDoc.getElementsByTagName('Lon');
    for (inc = 0; inc < xlat.length; inc++) {
      var latcode = xlat[inc].childNodes[0].nodeValue;
      var loncode = xlon[inc].childNodes[0].nodeValue;
      var GeoBus = {lat: latcode, lng: loncode};
      new google.maps.Marker({position: GeoBus, map: map});
    }
    var map = new google.maps.Map(document.getElementById('map'), {
          zoom: 4,
          center: {lat:48.3908449361675, lng:-4.48680591961381}
        });
}
</script>
<script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDw8GYeGNJySG_KDkhBFj4uHadD6G1Ahy4&callback=initMap">

</script>

但我得到了这个问题:

Ligne1.html:48 Uncaught TypeError: Cannot read property 'responseXML' of undefined
    at initMap (Ligne1.html:48)
    at js?key=AIzaSyDw8GYeGNJySG_KDkhBFj4uHadD6G1Ahy4&callback=initMap:97
    at js?key=AIzaSyDw8GYeGNJySG_KDkhBFj4uHadD6G1Ahy4&callback=initMap:66
    at Object._.Vd (js?key=AIzaSyDw8GYeGNJySG_KDkhBFj4uHadD6G1Ahy4&callback=initMap:64)
    at fe (js?key=AIzaSyDw8GYeGNJySG_KDkhBFj4uHadD6G1Ahy4&callback=initMap:66)
    at js?key=AIzaSyDw8GYeGNJySG_KDkhBFj4uHadD6G1Ahy4&callback=initMap:147
    at Object.google.maps.Load (js?key=AIzaSyDw8GYeGNJySG_KDkhBFj4uHadD6G1Ahy4&callback=initMap:21)
    at js?key=AIzaSyDw8GYeGNJySG_KDkhBFj4uHadD6G1Ahy4&callback=initMap:146
    at js?key=AIzaSyDw8GYeGNJySG_KDkhBFj4uHadD6G1Ahy4&callback=initMap:147

感谢您的帮助!

1 个答案:

答案 0 :(得分:0)

xlat[inc].childNodes[0].nodeValue的值不是一个数字,它是一个字符串 - 所以,让它成为一个数字 - 已解决...但是,在尝试添加标记后初始化地图 - 所以这也是一个问题

请参阅this fiddle了解您的代码的工作版本(出于某种原因,它不会在此处的代码段中运行

function initMap(xml) {
    var xlat, xlon, inc, xmlDoc, GeoBus, marker;
    xmlDoc = xml.responseXML; //line 48
    xlat = xmlDoc.getElementsByTagName('Lat');
    xlon = xmlDoc.getElementsByTagName('Lon');
    // initialise the map first
    var map = new google.maps.Map(document.getElementById('map'), {
        zoom: 12,
        center: {
            lat: 48.3908449361675,
            lng: -4.48680591961381
        }
    });
    for (inc = 0; inc < xlat.length; inc++) {
        var latcode = xlat[inc].childNodes[0].nodeValue;
        var loncode = xlon[inc].childNodes[0].nodeValue;
        var GeoBus = {
            lat: +latcode, // +latcode - makes it a Number
            lng: +loncode // +loncode - ditto
        };
        console.log(GeoBus);
        new google.maps.Marker({
            position: GeoBus,
            map: map
        });
    }
}