Google Maps infoWindow solo cargando el último registro en marcadores

Question

Estoy intentando cargar un mapa de Google con marcadores dinámicos e información dinámica de Windows para ir con ellos. Básicamente, tengo los marcadores funcionando. Las ventanas de información son clicables y se pueden cerrar, sin embargo, no tienen el contenido correcto. Parece que el contenido de cada ventana de información es el último registro que se encuentra en el bucle de consulta. Verá qué está sucediendo here Aquí está el código:

<script type="text/javascript"> 


//Load the Google Map with Options// 
    function initialize() { 
    var myLatlng = new google.maps.LatLng(42.48019996901214, -90.670166015625); 
    var myOptions = { 
     zoom: 6, 
     center: myLatlng, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    } 
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

    //Begin query loop to set the markers and infoWindow content// 

    <cfoutput query="GetCoord"> 
    var LatLng = new google.maps.LatLng(#Client_Lat#, #Client_Lng#); 

    var marker = new google.maps.Marker({ 
     position: LatLng, 
     map: map, 
     title: "#Client_Company#" 
    }); 

    var contentString = '<p><b>#Client_Company#</b><br>'+ 
         '#Client_Address#<br>'+ 
         '#Client_City#,&nbsp; #Client_State# &nbsp; #Client_Zip#<br>'+ 
         '<a href="member_detail.cfm?ID=#Client_ID#">View Details</a>'; 

    var infowindow = new google.maps.InfoWindow({ 
     content: contentString 
    }); 

    google.maps.event.addListener(marker, 'click', function() { 
     infowindow.open(map,this); 

    }); 
    </cfoutput> 
    //End query loop 
    } 

</script> 

¿Alguna idea sobre por qué ocurre esto?

Answer 1

En su código configura estáticamente el contenido ventana de información sobre la carga con

var infowindow = new google.maps.InfoWindow({ 
    content: contentString 
}); 

Luego, cuando se hace clic en sus marcadores que se acaba de abrir esa ventana de información

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

esto va a mostrar el mismo contenido para todos marcador, no quieres esto.

---

lo que quiere hacer es crear solo una ventana de información sin contenido (antes de su bucle marcador). luego, cuando se hace clic en un marcador, adjunte el contenido a la ventana de información ... luego abra la ventana de información. Esto salvará las líneas de código y hará que la ventana de información se cierre automáticamente.

antes de crear los marcadores (con el bucle) añadir este

infowindow = new google.maps.InfoWindow(); 

en su código de marcador de añadir la llamada infowindow.setContent

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

}); 

Answer 2

Añadir content como una propiedad de objeto marcador y utilizar this.content en el controlador de eventos:

var marker = new google.maps.Marker(options); 
marker.content = '<div>Content goes here....</div>'; 

var infoWindow = new google.maps.InfoWindow(); 
google.maps.event.addListener(marker, 'click', function() { 
           infoWindow.setContent(this.content); 
           infoWindow.open(this.getMap(), this); 
          });