2013-09-28 53 views
12

Làm thế nào để tôi có được tất cả các cửa sổ thông tin đóng khi bấm vào một ghim khác hoặc bấm vào bản đồ trong chính nó? Tôi đang sử dụng http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobox/docs/reference.html và lớp phủ kml. heres JS của tôi cho đến nay:Đóng tất cả cửa sổ thông tin bản đồ google API V3?

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); 
}); 

Trả lời

46

Như bạn thấy trong API docs, một hộp thông tin có -method close().

Thu thập tất cả các InfoBox bạn tạo trong một mảng. Sau đó, lặp qua mảng này và gọi close cho mỗi hộp thông tin, khi bạn cần đóng tất cả cùng một lúc.

Trong phía trên, thêm một mảng để chứa tất cả các infoboxes tạo

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

Trong chức năng showInContentWindow thêm những điều sau đây ngay sau khi var infowindow=new.., ví dụ ngay trước infowindow.open

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

thêm chức năng này

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

tại đây được gọi bằng liên kết

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

Tốt và dễ dàng! thanks –

+3

Nhưng những gì về người dùng cửa sổ thông tin có thể đã mở bye clicKing google địa điểm? –

+0

Giải pháp tuyệt vời. Cảm ơn! – TechyDude

7

Bạn cũng có thể giữ cho hoạt động (mở) cửa sổ thông tin của bạn trong một phạm vi cao hơn hoặc biến toàn cầu

var activeInfoWindow; 

và bấm vào nghe sự kiện, đóng cửa sổ thông tin tích cực (nếu có một), sau đó đặt this cửa sổ thông tin là hoạt động

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

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

Đây là giải pháp tốt nhất nếu bạn chỉ có 1x infowindow mở tại một thời điểm – stef

Các vấn đề liên quan