谷歌地图：信息窗口没有关闭

Question

当我单击另一个标记时，我的信息窗口不会自动关闭.. 这里的代码：http://pastebin.com/PvCt2z7W 这是带有 infowindows 的标记的代码

 for (var n = 0 ; n <listFavourite.length ; n++)
                    //var favouriteObject =listFavourite[n];
                       addMarker(listFavourite[n]);
                   }           
                   function addMarker(data) {
                       var marker = new google.maps.Marker({
                           position: new google.maps.LatLng(data.lattitude, data.longitude),
                           map: map,
                           title: data.address
                       });

                       var contentString = '<div id="content">'+
                           '<div id="siteNotice">'+
                           '</div>'+
                           '<h2 id="firstHeading" class="firstHeading">'+data.name+'</h2>'+
                           '<div id="bodyContent">'+
                           '<p>'+data.address+'</p>'+
                           '<p></p>'+
                           '<p>Do You Want to change search location</p>'+
                           '<input name="yes" id="yes" type="button" class="btn-common" value="Yes"/>'+
                           '</div>'+
                           '</div>';                                                   
                       var infowindow = new google.maps.InfoWindow({
                       maxWidth: 10,
                       });              
                       google.maps.event.addListener(marker, "click", function() {                     
                           infowindow.setContent(contentString);
                           infowindow.open(map, marker);                       
                       });     
                   };

我在这里尝试了所有答案，但无法正常工作 任何建议或帮助将不胜感激

Answer 1

不是为每个标记创建一个信息窗口，而是有一个全局信息窗口变量。然后，您在标记单击处理程序中所做的一切就是每次更新标记的内容。但是，您的代码将要求使用闭包来完成此操作，否则您将获得具有最后一个标记内容的每个标记。

var infowindow = new google.maps.InfoWindow({
   maxWidth: 10
});

var arrMarkers = [];

function addMarker(data) {
   var marker = new google.maps.Marker({
       position: new google.maps.LatLng(data.lattitude, data.longitude),
       map: map,
       title: data.address
   });

    arrMarkers.push(marker);

   var contentString = '<div id="content">'+
       '<div id="siteNotice">'+
       '</div>'+
       '<h2 id="firstHeading" class="firstHeading">'+data.name+'</h2>'+
       '<div id="bodyContent">'+
       '<p>'+data.address+'</p>'+
       '<p></p>'+
       '<p>Do You Want to change search location</p>'+
       '<input name="yes" id="yes" type="button" class="btn-common" value="Yes"/>'+
       '</div>'+
       '</div>';                                                   


    // add an event listener for this marker
    bindInfoWindow(marker, map, infowindow, contentString);   
}


function bindInfoWindow(marker, map, infowindow, html) { 
    google.maps.event.addListener(marker, 'click', function() { 
        infowindow.setContent(html); 
        infowindow.open(map, marker); 
    }); 
}

function clickLink(ID) {
    google.maps.event.trigger(arrMarkers[ID], 'click');
}

您的侧边栏链接 HTML 可能如下所示：

<a href="javascript:clickLink(0); return false;">Link 1</a><br>
<a href="javascript:clickLink(1); return false;">Link 2</a><br>
...

Answer 2

使用函数闭包的另一个选项（基本上涉及使用 createMarker 函数）是将信息窗口的内容保存在标记的属性中。使用单个信息窗口仍然是最简单的。您没有在您的 pastebin 中提供足够的上下文来为您提供一个可行的示例。

这是一个使用函数闭包将信息窗口内容与标记相关联的示例，并且具有单个信息窗口（翻译自 Mike Williams 的 v2 教程）。

http://www.geocodezip.com/v3_MW_example_map3.html

Mike Williams' description of function closure

这是一个不使用函数闭包的示例（它将信息窗口内容存储在标记对象的属性中）：

http://www.geocodezip.com/v3_MW_example_map3_noclosure.html