關閉所有信息窗口谷歌地圖API V3？

Question

如何獲取所有信息窗口在關閉其他別針或點擊地圖本身時關閉？ 我正在使用http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobox/docs/reference.html 和一個kml覆蓋。 我的繼承人JS至今：

jQuery(document).ready(function ($) { 
    function initialize() { 
     google.maps.visualRefresh = true; 
     var myLatlng = new google.maps.LatLng(51.201465, -0.30244); 
     var mapOptions = { 
      zoom: 12, 
      center: myLatlng, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 

     var map = new google.maps.Map(document.getElementById('map-canvas'), 
     mapOptions); 

     var kmlLayer = new google.maps.KmlLayer({ 
      url: 'http://***.com/new/wp-content/themes/required-starter/CGAGolfAcademies.kml?rand=' + (new Date()).valueOf(), 
      suppressInfoWindows: true, 
      map: map 
     }); 

     google.maps.event.addListener(kmlLayer, 'click', function (kmlEvent) { 
      showInContentWindow(kmlEvent.latLng, kmlEvent.featureData.description); 
     }); 

     function showInContentWindow(position, text) { 
      var content = "<div class='info_win'><p>" + text + "</p></div>"; 
      var infowindow =new InfoBox({ 
       content: content, 
       disableAutoPan: false, 
       maxWidth: 0, 
       position: position, 
       pixelOffset: new google.maps.Size(-140, 0), 
       zIndex: null, 
       boxStyle: { 
        background: "#FBFBFB" 
        ,opacity: 0.90 
        ,width: "280px" 
       }, 
       closeBoxMargin: "10px 2px 2px 2px", 
       closeBoxURL: "http://www.google.com/intl/en_us/mapfiles/close.gif", 
       infoBoxClearance: new google.maps.Size(1, 1), 
       isHidden: false, 
       pane: "floatPane", 
       enableEventPropagation: false 
     }); 


    infowindow.open(map); 

     } 
        /******AJAX MAP ****/ 
      siteURL = 'http://' + top.location.host.toString(); 
      coachesLinks = jQuery('.info_win a'); 
      coachesLinks.click(function (e) { 
       e.preventDefault(); 
      }); 
      coachesLinks.click(function (e) { 
       alert('FRED'); 
       $el = jQuery(this); 
       URL = $el.attr('href'); 
       shareurl = $el.attr('href'); 
       URL = URL + " .main"; 
       jQuery('#content_two').show('slow').load(URL, function() { 
        scrollToAnchor('content_two'); 
        $('.main').css('overflow', 'visible'); 
        $('#content_two').css('overflow', 'visible'); 
        jQuery('#content_two .back').on('click', function() { 
         jQuery(this).hide('slow'); 
         var contentTwo = jQuery('#content_two'); 
         if (contentTwo.is(':hidden')) { 
          jQuery('#content_two .back').hide(); 
         } else { 
          contentTwo.hide('slow'); 
          jQuery('#content > .main').show('slow'); 
          jQuery('#content > .main').css('overflow', 'visible'); 
          scrollToAnchor('access'); 
         } 
        }); 

       }); 
       $('#content > .main').hide('slow'); 
      }); 

    } 

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

Answer 1

正如您在API docs看到，一個信息框有close() - 方法。

收集您在數組中創建的所有InfoBox。然後遍歷這個數組，並且當你需要一次關閉它們時，爲每個信息框調用close。

在頂部添加一個數組來保存所有InfoBoxes到創建

jQuery(document).ready(function ($) { 
    var infoWindows = []; 

在功能showInContentWindow添加以下之後var infowindow=new..，如之前infowindow.open

//add infowindow to array 
infoWindows.push(infowindow); 

添加此功能

function closeAllInfoWindows() { 
    for (var i=0;i<infoWindows.length;i++) { 
    infoWindows[i].close(); 
    } 
} 

這裏由鏈接調用

<a href="#" onclick="closeAllInfoWindows();">Close all infowindows</a> 

Answer 2

您也可以將您的活動（打開）信息窗口在更高範圍或全局變量

var activeInfoWindow; 

，並在click事件偵聽器，關閉活動的信息窗口（如果有一個），然後設置this信息窗口爲活動

var infoWindow = new google.maps.InfoWindow({ 
    content: name 
}); 

google.maps.event.addListener(marker, 'click', function() { 
    activeInfoWindow&&activeInfoWindow.close(); 
    infoWindow.open(map, marker); 
    activeInfoWindow = infoWindow; 
});