0

我使用“maps.googleapis.com/maps/api/js?v=3”创建了一个谷歌地图。在该地图中，我显示了不同位置的标记，效果很好。下面是我使用的代码。

google.maps.event.addDomListener(window, 'load', function() {
                var map = new google.maps.Map(document.getElementById('map1'), {
                      zoom: 10,
                      center: new google.maps.LatLng(latitude, longitude),
                      mapTypeId: google.maps.MapTypeId.ROADMAP
                });
                var marker = new google.maps.Marker({
                                map: map,
                                position: new google.maps.LatLng(23.42323, -45.47653),

                            });
});

现在我想在 Ajax 中添加更多位置标记。例如：我将从下拉列表中添加位置名称，它会对服务器端进行 ajax 调用。拉出位置经纬度，会显示在地图上。我怎样才能实现它。

我已经编写了一个单独的 js 函数来执行 ajax 调用，但是在里面的代码没有得到'map'实例。这里我只使用了这段代码 

    new google.maps.Marker({
    map: map,
    position: new google.maps.LatLng(23.42323, -45.47653),
});

这里我不再初始化地图。所以它没有得到地图实例并抛出错误。如何修复它。

4

2 回答 2

1

地图的范围仅限于事件句柄内部。尝试这个：

var map, markerCollection;

google.maps.event.addDomListener(window, 'load', function() {
    map = new google.maps.Map(document.getElementById('map1'), {
        zoom: 10,
        center: new google.maps.LatLng(latitude, longitude),
        mapTypeId: google.maps.MapTypeId.ROADMAP
    });
});

function addMarker(lat, lng){
    var marker = new google.maps.Marker({
        map: map,
        position: new google.maps.LatLng(lat, lng),
    });
    markerCollection.push(marker);
}

注意： 1) 定义地图中心时，请填写“纬度”和“经度”的值。否则，您只会显示地图。2) 我知道将标记添加到数组中可能不是最佳做法，但我发现这比后者更容易访问。

于 2013-03-29T15:15:07.593 回答
0

由于map不是全局变量，因此它正在被取消引用。使map对象成为全局对象或在存储所有代码的容器函数中。

全局 JS 示例

//now it's global
var map;
google.maps.event.addDomListener(window, 'load', function () {
    map = new google.maps.Map(document.getElementById('map1'), {
        zoom: 10,
        center: new google.maps.LatLng(latitude, longitude),
        mapTypeId: google.maps.MapTypeId.ROADMAP
    });
    var marker = new google.maps.Marker({
        map: map,
        position: new google.maps.LatLng(23.42323, -45.47653),
    });
});
于 2013-03-29T15:14:10.940 回答