2013-09-28 1 views
12

Come faccio a chiudere tutte le finestre di informazioni dopo aver scelto un altro pin o aver fatto clic sulla mappa? Sto usando http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobox/docs/reference.html e una sovrapposizione di kml. heres il mio JS finora:Chiudi tutte le info windows google maps 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); 
}); 

risposta

46

Come si vede nella API docs, un infobox ha un -Metodo close().

Colleziona tutte le InfoBox create in un array. Quindi esegui l'iterazione su questo array e chiama close per ogni infobox, quando è necessario chiuderli tutti in una volta.

In cima, aggiungere un array per contenere tutte le infoboxes creato

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

In funzione showInContentWindow aggiungere la seguente subito dopo var infowindow=new.., ad esempio prima infowindow.open

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

inserirlo questa funzione

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

qui chiamato da un collegamento

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

Bello e facile! grazie –

+3

Ma per quanto riguarda l'utente di windows info Può aver aperto ciao clicKing google places? –

+0

Ottima soluzione. Grazie! – TechyDude

7

Si può anche mantenere il vostro attivo (aperto) finestra di informazioni in un ambito più alta o variabile globale

var activeInfoWindow; 

e in chi ascolta evento click, chiudere la finestra di informazione attiva (se c'è uno), quindi imposta la finestra informazioni this come attiva

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

Questa è la soluzione migliore se hai solo 1x finestra aperta alla volta – stef