-1

I have this working multy markers script. Markers are printed on the map but when I click on any marker I can see same info window.. Something wrong in this loop:

    function bindInfoWindow(marker, map, infowindow, content) {
    google.maps.event.addListener(marker, 'click', function() {
        infowindow.setContent(content);
        infowindow.open(map, marker);
    });
}
function initialize() {
var map;
var locations = <?php echo json_encode($location); ?>;

var bounds = new google.maps.LatLngBounds();
var mapOptions = {
    mapTypeId: 'roadmap'
};
// Display a map on the page
map = new google.maps.Map(document.getElementById("googlemap"), mapOptions);

// Multiple Markers
var markers = locations;        
// Display multiple markers on a map
var infoWindow = new google.maps.InfoWindow();

// Loop through our array of markers & place each one on the map 
for( i = 0; i < markers.length; i++ ){
loc_array = markers[i].split(",");
    var position = new google.maps.LatLng(loc_array[1], loc_array[2]);
    bounds.extend(position);
    marker = new google.maps.Marker({
        position: position,
        map: map,
        draggable: false,
        raiseOnDrag: true,
        title: loc_array[0]
    });
    // Info Window Content
    content=loc_array[0] + " - <a class='ac' onclick='move("+ loc_array[4] +");' href='#'>" + <?php echo json_encode($lang['view_profile']);?> + "</a><span class='p'>" + <?php echo json_encode($lang['phone']);?> + ": " + loc_array[6] + " </span><span class='p'>" + <?php echo json_encode($lang['address']);?> + ": " + loc_array[5] + ", " + loc_array[7] + ", " + loc_array[8] + "</span>";
    bindInfoWindow(marker, map, infoWindow, content);

    //infowindow = new google.maps.InfoWindow();
    console.log(content);
    // Allow each marker to have an info window    
    google.maps.event.addListener(marker, 'click', (function(marker, i) {
        return function() {
            infoWindow.setContent(content);
            infoWindow.open(map, marker);
        }
    })(marker, i));

    // Automatically center the map fitting all markers on the screen
    map.fitBounds(bounds);
}
bounds.extend(marker.position); 
// Override our map zoom level once our fitBounds function runs (Make sure it only runs once)
var boundsListener = google.maps.event.addListener((map), 'bounds_changed', function(event) {
   map.fitBounds(bounds);
    google.maps.event.removeListener(boundsListener);
});
}

When I print individual info in console I can see different info windows, but on the map all come same:

console.log(content);

I call initialize() on body load Please help where I am wrong, Thanks !

Europeuser
  • 934
  • 1
  • 9
  • 32
  • possible duplicate of [Google Maps JS API v3 - Simple Multiple Marker Example](http://stackoverflow.com/questions/3059044/google-maps-js-api-v3-simple-multiple-marker-example) – geocodezip Oct 03 '15 at 15:13

1 Answers1

1

First of all declare infowindow globally in following way:

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

Then after creating marker and content string just call this function:

bindInfoWindow(marker, map, infoWindow, content);

This is the definition of function bindInfoWindow()

function bindInfoWindow(marker, map, infowindow, content) {
        google.maps.event.addListener(marker, 'click', function() {
            infowindow.setContent(content);
            infowindow.open(map, marker);
        });
    }
Sunil
  • 919
  • 15
  • 25
  • #sunil, thank you, I updated the code with yours but no change. Please look at edited full code that I have on site , including your changes.. Still same pop up info window for all markers.. Please check my updated code, thanks – Europeuser Oct 03 '15 at 11:46
  • You didn't removed your code after calling bindInfoWindow() function,..Remove this code // Allow each marker to have an info window google.maps.event.addListener(marker, 'click', (function(marker, i) { return function() { infoWindow.setContent(content); infoWindow.open(map, marker); } })(marker, i)); – Sunil Oct 03 '15 at 11:51
  • Oh, yes :) Now it is working Sunil. Huge Thank you for your help ! – Europeuser Oct 03 '15 at 11:53