Vários marcadores da API do Google Maps com Infowindows

Eu estou tentando adicionar vários marcadores cada um com seu próprio infowindow que aparece quando clicado. Estou tendo problemas em obter as informações de progresso, quando eu as tento mostra apenas um marcador sem uma janela de informações.

Obrigado, deixe-me saber se você precisar de mais algumas informações

  html { height: 100% } body { height: 100%; margin: 0; padding: 0 } #map_canvas { height: 100% }     var locations = [ ['loan 1', 33.890542, 151.274856, 'address 1'], ['loan 2', 33.923036, 151.259052, 'address 2'], ['loan 3', 34.028249, 151.157507, 'address 3'], ['loan 4', 33.80010128657071, 151.28747820854187, 'address 4'], ['loan 5', 33.950198, 151.259302, 'address 5'] ]; function initialize() { var myOptions = { center: new google.maps.LatLng(33.890542, 151.274856), zoom: 8, mapTypeId: google.maps.MapTypeId.ROADMAP }; var map = new google.maps.Map(document.getElementById("default"), myOptions); setMarkers(map, locations) } function setMarkers(map, locations) { var marker, i for (i = 0; i < locations.length; i++) { var loan = locations[i][0] var lat = locations[i][1] var long = locations[i][2] var add = locations[i][3] latlngset = new google.maps.LatLng(lat, long); var marker = new google.maps.Marker({ map: map, title: loan, position: latlngset }); map.setCenter(marker.getPosition()) var content = "Loan Number: " + loan + '' + "Address: " + add var infowindow = new google.maps.InfoWindow() google.maps.AddListener(marker, 'click', function (map, marker) { infowindow.setContent(content) infowindow.open(map, marker) }); } }    

Você poderia usar um fechamento. Apenas modifique seu código assim:

 google.maps.event.addListener(marker,'click', (function(marker,content,infowindow){ return function() { infowindow.setContent(content); infowindow.open(map,marker); }; })(marker,content,infowindow)); 

Aqui está o DEMO

Aqui está o trecho de código que funcionará com certeza. Você pode visitar abaixo link para trabalhar jsFiddle e explainantion em detalhes. Como localizar vários endereços no google maps com zoom perfeito

 var infowindow = new google.maps.InfoWindow(); google.maps.event.addListener(marker, 'mouseover', (function(marker) { return function() { var content = address; infowindow.setContent(content); infowindow.open(map, marker); } })(marker)); 

Se você também quiser ligar o fechamento da infowindow a algum evento, tente algo como isto

 google.maps.event.addListener(marker,'click', (function(marker,content,infowindow){ return function() { infowindow.setContent(content); infowindow.open(map,marker); windows.push(infowindow) google.maps.event.addListener(map,'click', function(){ infowindow.close(); }); }; })(marker,content,infowindow)); 
 function setMarkers(map,locations){ for (var i = 0; i < locations.length; i++) { var loan = locations[i][0]; var lat = locations[i][1]; var long = locations[i][2]; var add = locations[i][3]; latlngset = new google.maps.LatLng(lat, long); var marker = new google.maps.Marker({ map: map, title: loan , position: latlngset }); map.setCenter(marker.getPosition()); marker.content = "

Loan Number: " + loan + '

' + "Address: " + add; google.maps.events.addListener(marker,'click', function(map,marker){ map.infowindow.setContent(marker.content); map.infowindow.open(map,marker); }); } }

Em seguida, mova var infowindow = new google.maps.InfoWindow() para a function initialize() :

 function initialize() { var myOptions = { center: new google.maps.LatLng(33.890542, 151.274856), zoom: 8, mapTypeId: google.maps.MapTypeId.ROADMAP }; var map = new google.maps.Map(document.getElementById("default"), myOptions); map.infowindow = new google.maps.InfoWindow(); setMarkers(map,locations) }