Google地图叠加层无法定位正确的标记

时间:2013-04-16 21:52:36

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

我正在尝试制作一个标记列表以固定到地图上,每个标记都有自己的叠加层。它主要是工作,但是叠加层都被放置在彼此的顶部而不是相应的标记上。

代码如下:

var myCenter = getMyLocation();

function initialize()
{
  var mapProp = {
    center: myCenter,
    zoom:9,
    mapTypeId:google.maps.MapTypeId.ROADMAP
  };

  var map = new google.maps.Map(document.getElementById("googleMap"),mapProp);

  var locations = [
    {lat: -27.646670, lng: 152.86918630, text: 'Address #1'},
    {lat: -27.6446550, lng: 152.7822390, text: 'Address #2'},
    {lat: -27.6062480, lng: 152.7889550, text: 'Address #3'}
  ];

  // Loop through our list and plot them on the map
  locations.forEach(function (l) {

    marker =  new google.maps.Marker({
      position: new google.maps.LatLng(l.lat, l.lng),
    });

    marker.setMap(map);

    // Create our infoWindow panel for our marker
    var infoWindow = new google.maps.InfoWindow({
      content: l.text
    });

    // Bind click event for our marker
    google.maps.event.addListener(marker, 'click', function () {
      infoWindow.open(map, marker);
    });
  });

}

google.maps.event.addDomListener(window, 'load', initialize);

我觉得这个问题与点击addListener事件

有关

2 个答案:

答案 0 :(得分:3)

您只是错过了var

marker =  new google.maps.Marker(...

应该是:

var marker =  new google.maps.Marker(

因此,您只需要一个全局marker变量,而不是每个标记的唯一变量。

由于您正在使用带有回调函数的.forEach,因此该回调函数为循环的每次迭代提供了一个闭包。所以你需要的是通过在回调中使marker局部变量来利用该闭包。

答案 1 :(得分:0)

也许关闭会对你有帮助吗?标记是一个对象,因为它在每个循环链接上都会发生变化。关闭会阻止它。

google.maps.event.addListener(marker, 'click', (function(marker){ return function () {
      infoWindow.open(map, marker);
};})(marker));