infowindows google maps v3 с несколькими местоположениями

Question

Здравствуйте, я хотел бы иметь infowindows в обоих местах, которые отмечены. Но я не знаю, как это сделать. Я использую google maps api v3. Любой answed будет очень оценен. Код выглядит следующим образом:

var locations = [ 
    ['Bondi Beach', 36.773861, -2.804269], 
    ['Coogee Beach', 36.839467, -2.463484], 
]; 

var map = new google.maps.Map(document.getElementById('map'), { 
    zoom: 20, 
scrollwheel: false, 
    center: new google.maps.LatLng(-39.92, 151.25), 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
}); 

var infowindow = new google.maps.InfoWindow(); 

var marker, i; 
var markers = new Array(); 

for (i = 0; i < locations.length; i++) { 
    marker = new google.maps.Marker({ 
    position: new google.maps.LatLng(locations[i][1], locations[i][2]), 
    map: map 
    }); 

    markers.push(marker); 

    google.maps.event.addListener(marker, 'click', (function(marker, i) { 
    return function() { 
     infowindow.setContent(locations[i][0]); 
     infowindow.open(map, marker); 

    } 
    })(marker, i)); 
} 



function AutoCenter() { 
    // Create a new viewpoint bound 
    var bounds = new google.maps.LatLngBounds(); 
    // Go through each... 
    $.each(markers, function (index, marker) { 
    bounds.extend(marker.position); 
    }); 
    // Fit these bounds to the map 
    map.fitBounds(bounds); 
} 
AutoCenter(); 

Answer 1

Вам понадобится один InfoWindow-экземпляр для каждых маркеров, когда несколько infowindows должны быть видны одновременно

for (i = 0; i < locations.length; i++) { 
    marker = new google.maps.Marker({ 
    position: new google.maps.LatLng(locations[i][1], locations[i][2]), 
    map: map, 
    //store for each marker a infowindow 
    infowin:new google.maps.InfoWindow({content:locations[i][0], 
             preserveViewport:true, 
             map:null}) 
    }); 

    markers.push(marker); 

    google.maps.event.addListener(marker, 'click', function() { 
     //open the infowindow 
     this.get('infowin').open(this.getMap(), marker); 

    }); 
    //trigger the marker-click to open the infowindow automatically 
    google.maps.event.trigger(marker,'click',{}); 
}