无法使用AJAX动态显示多个Google地图标记

时间:2012-01-26 20:05:14

标签: javascript ajax google-maps google-maps-api-3

根据用户从下拉菜单中选择的内容,AJAX会检索应该在地图上标记的位置的纬度和经度,但我无法显示标记。以下是代码。

function selectRoute() {
        var route = $("select option:selected").val();
        if (window.XMLHttpRequest) {
            // code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp=new XMLHttpRequest();
        }
        else {
            // code for IE6, IE5
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange=function() {
            if (xmlhttp.readyState==4 && xmlhttp.status==200) {
                var locations = xmlhttp.responseText;
                var marker, i;
                for (i = 0; i < locations.length; i++) {
                    marker = new google.maps.Marker({
                        position: new google.maps.LatLng(locations[i][0], locations[i][1]),
                        map: map
                    });
                }
            }
        }
        marker.setMap(map);
        xmlhttp.open("GET","../lib/markers.php?route="+route,true);
        xmlhttp.send();
    }

以下是从markers.php页面中检索到的responseText:

[[38.018914, -121.945154], [38.003275, -122.024597], [37.973737, -122.029095], and on and on];

我唯一的想法是问题是这个代码不是初始化谷歌地图的initialize()函数,但是如果这个问题我还没有能够把它结合起来如果你愿意,有两个功能。除此之外,我无法理解什么是不起作用的。提前谢谢!

1 个答案:

答案 0 :(得分:1)

 var locations = xmlhttp.responseText;

所以location是一个字符串,你需要解析JSON。然后一切都应该很好地工作

...除marker.setMap(map);外,它在函数之外;并且您无论如何都不需要它,因为您在标记选项中设置了地图。