0

我正在尝试获取多个地址的信息窗口。它正在创建标记，但是当我单击标记时，不会弹出信息窗口。请帮忙看看这段代码有什么问题。其余所有信息都很好，唯一的问题是信息窗口没有出现。

<!DOCTYPE html>
<html> 
<head> 
  <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> 
  <title>Google Maps Multiple Markers</title> 
  <script src="http://maps.google.com/maps/api/js?sensor=false" 
          type="text/javascript"></script>
</head> 
<body>
  <div id="map" style="height: 800px;"></div>

  <script type="text/javascript">
    var locations = [
      ['Bondi Beach', '850 Bay st 04 Toronto, Ont'],
      ['Coogee Beach', '932 Bay Street, Toronto, ON M5S 1B1'],
      ['Cronulla Beach', '61 Town Centre Court, Toronto, ON M1P'],
      ['Manly Beach', '832 Bay Street, Toronto, ON M5S 1B1'],
      ['Maroubra Beach', '606 New Toronto Street, Toronto, ON M8V 2E8']
    ];

    var map = new google.maps.Map(document.getElementById('map'), {
      zoom: 10,
      center: new google.maps.LatLng(43.253205,-80.480347),
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });

    var infowindow = new google.maps.InfoWindow();
    var geocoder = new google.maps.Geocoder();

    var marker, i;

    for (i = 0; i < locations.length; i++) {

        geocoder.geocode( { 'address': locations[i][1]}, function(results, status) {
            //alert(status);
            if (status == google.maps.GeocoderStatus.OK) {

                //alert(results[0].geometry.location);
                map.setCenter(results[0].geometry.location);
                marker = new google.maps.Marker({
                    position: results[0].geometry.location,
                    map: map
                }); 

                google.maps.event.addListener(marker, 'mouseover', function() { infowindow.open(marker, map);});
                google.maps.event.addListener(marker, 'mouseout', function() { infowindow.close();});

            }
            else
            {
                alert("some problem in geocode" + status);
            }
        }); 
    }

  </script>
</body>
</html>
4

2 回答 2

1

您有 google.maps.InfoWindow.open 方法的参数向后：

打开（地图？：地图|街景全景，锚点？：MVCObject）| 无 | 在给定地图上打开此信息窗口。可选地，信息窗口可以与锚相关联。在核心 API 中，唯一的锚点是 Marker 类。但是，锚点可以是任何 MVCObject，它公开 LatLng 位置属性和可选的用于计算 pixelOffset 的 Point anchorPoint 属性（请参阅 InfoWindowOptions）。anchorPoint 是从锚点位置到信息窗口尖端的偏移量。

google.maps.event.addListener(marker, 'mouseover', function() { infowindow.open(marker, map);});

应该：

google.maps.event.addListener(marker, 'mouseover', function() { infowindow.open(map, marker);});

工作示例

于 2013-06-30T17:35:35.730 回答
0

为避免与范围有关的问题marker，您可以执行以下两项操作之一

1

使回调marker本地化：geocoder.geocode()

var marker = new google.maps.Marker({...});

并更正传递给的参数的顺序infowindow.open()：

google.maps.event.addListener(marker, 'mouseover', function() { infowindow.open(map, marker);});

2

使用this, 从其自己的事件处理程序中可靠地引用回标记，如下所示：

google.maps.event.addListener(marker, 'mouseover', function() {
    infowindow.open(map, this);
});

就个人而言，我会使用方法2。

于 2013-06-30T20:11:29.210 回答