无法读取属性“responseXML”谷歌地图答案

【问题标题】：Cannot read property 'responseXML' Google Map无法读取属性“responseXML”谷歌地图
【发布时间】：2018-04-04 09:11:18
【问题描述】：

使用 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

感谢您的帮助！

【问题讨论】：

看到这个https://maps.googleapis.com/maps/api/js?key=...&callback=initMap ...它在没有参数的情况下调用initMap ...您似乎试图用一个只希望以一种方式调用的函数做两件事
感谢我们删除了“&callback=initMap”，但现在我遇到了这个错误：InvalidValueError: setPosition: not a LatLng or LatLngLiteral: in property lat: not a number
xlat[inc].childNodes[0].nodeValue 可能不是一个数字 - console.log(JSON.stringify(GeoBus)) 分配给它之后...看起来对吗？
是的，这是一个数字，您可以通过此链接查看：XML 或JSON。当我结束我的一天后，我会试试你的 console.log
不，它是一个 字符串 - 请参阅下面的答案

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

【解决方案1】：

xlat[inc].childNodes[0].nodeValue 的值不是一个数字，它是一个字符串 - 所以，把它变成一个数字 - 解决了......但是，你在尝试添加标记之后初始化地图 - 所以这就是也是个问题

请参阅this fiddle 了解您的代码的工作版本（由于某种原因，它不会在此处的 sn-p 中运行

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

【讨论】：