Инфобокс Google Maps не работает при нажатии маркера

Question

У меня была карта google, где инфобокс был скрыт при загрузке страницы. Чтобы открыть инфобокс, я бы нажал на пользовательский маркер (pin) и отобразился infbox. Если бы я второй раз щелкнул маркером, информационное окно закроется.

Теперь, так как последние карты google. Инфобокс автоматически открывается при загрузке, а щелчок маркером ничего не делает. Не закрывается, не открывается.

вот код для инфобокса.

Спасибо всем!

// infobox 
      var $infoboxText = 
       $('<div class="inner">').html(contentHtml); 

      var myOptions = { 
       boxClass:'gmap_infobox', 
       content:$infoboxText.get(0), 
       disableAutoPan:false, 
       maxWidth:0, 
       alignBottom:false, 
       pixelOffset:new google.maps.Size(0, 0), 
       zIndex:null, 
       closeBoxURL:"", 
       infoBoxClearance:new google.maps.Size(1, 1), 
       isHidden:false, 
       pane:"floatPane", 
       enableEventPropagation:false 
      }; 

      var InfoBoxClose = function() { 
       myOptions.boxClass = 'gmap_infobox'; 
       ib.setOptions(myOptions); 
      }; 

      var InfoBoxOpen = function() { 
       var $content = $(myOptions.content); 

       if ($content.html().length > 0) { 
        myOptions.boxClass = $content.is(':visible') ? 'gmap_infobox' : 'gmap_infobox gmap_infobox--visible'; 
        ib.setOptions(myOptions); 
       } 
      }; 

      InfoBox.prototype.getCloseClickHandler_ = function() { 
       return handleInfoBoxClose; 
      }; 

      var ib = new InfoBox(myOptions); 
      ib.open(map, marker); 

      if (config.marker === 'open-bubble') { 
       InfoBoxOpen(); 
      } 

      // listeners 
      google.maps.event.addListener(marker, 'click', function() { 
       InfoBoxOpen(); 
      }); 
     } 

Answer 1

Во-первых, пропустите это: the reference api. В частности, часть на InfoWindow и InfoWindowOptions.

Затем дать это попробовать

var map, myInfoWindow; 
function initialize() { 
    //Create the map 
    var mapOptions = { 
     zoom: 4, 
     center: new google.maps.LatLng(38.8282, -98.5795), 
    }; 
    map = new google.maps.Map(document.getElementById('map_canvas'),mapOptions); 

    //Create the infoWindow 
    var iwOptions = {content: "stuff"}; //put your infowindow options here 
    myInfoWindow = new google.maps.InfoWindow(iwOptions); 

    //coordinates for marker placement 
    var myLatLng = [ 
        new google.maps.LatLng(32, -83), 
        new google.maps.LatLng(41, -90), 
        new google.maps.LatLng(38, -109) 
        ]; 

    //Create markers 
    for(var i=0; i<myLatLng.length; i++){ 
     var marker = new google.maps.Marker({ 
      position: myLatLng[i], 
      map: map 
     }) 

     //This is the important part: add this to each of you markers 
     google.maps.event.addListener(marker, 'click', function(){ 
      if(myInfoWindow.anchor === this){ 
       myInfoWindow.close(); 
      } else { 
       myInfoWindow.open(map, this); 
      } 
     }); 
    } 
} 
google.maps.event.addDomListener(window, 'load', initialize);