单击标记谷歌地图时无法弹出InfoWindow

时间:2011-11-16 20:08:29

标签: javascript google-maps-api-3 infowindow marker google-geocoder

我做错了什么?我基本上试图弹出一个非常简单的信息窗口,点击标记..标记显示正常,但标记点击事件没有被响应..我很确定InfoWindow代码不在正确的地点..对应的标记的地址正由jquery为每个人提供..

var geocoder;
var map;    
geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng(39.88445,-86.11084);
var myOptions = {
  zoom: 10,
  center: latlng,
  mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map_canvas"),
  myOptions);


$('span.Address .ms-rtestate-field').each(function(index) {
    var addy = $(this).text();
    geocoder.geocode( { 'address': addy}, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            map.setCenter(results[0].geometry.location);
            var marker = new google.maps.Marker({
            map: map, 
            position: results[0].geometry.location,
            title:addy
        });
        }else {
            alert("Geocode was not successful for the following reason: " + status);
        }
    });


    // Creating an InfoWindow          
    var infowindow = new google.maps.InfoWindow({
    content: 'Hello world'
   });

    // Adding a click event to the marker
    google.maps.event.addListener(marker, 'click', function() {
    return function(){
     // Opening the InfoWindow
    infowindow.open(map, marker);
    }
   });

});

1 个答案:

答案 0 :(得分:1)

您只需要一个infowindow实例,然后使用setContent()方法在onclick事件期间更改内容。此外,您应该将事件处理程序放在地理编码回调函数中,以确保在地理编码器完成时它已连接。

试试这个:

// Creating an InfoWindow          
var infowindow = new google.maps.InfoWindow({});

$('span.Address .ms-rtestate-field').each(function(index) {
    var addy = $(this).text();
    geocoder.geocode( { 'address': addy}, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            map.setCenter(results[0].geometry.location);

            var marker = new google.maps.Marker({
                map: map, 
                position: results[0].geometry.location,
                title:addy
            });

            // Adding a click event to the marker
            google.maps.event.addListener(marker, 'click', function() {
                infowindow.setContent("Hello World!");
                infowindow.open(map, this);
            }); 

        }else {
            alert("Geocode was not successful for the following reason: "
                  + status);
        }
    });

});