Google Maps - Passing Information to the Event Listener

Question

I think this is a scale problem. Since the event fires after I have added all the listeners, num_markers has always been overridden by the next loop in the loop.

Is there a way to pass variables to event functions?

I tried this approach, but it is not for me. Google Maps: Event Listener remembers only the final value of a variable

var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); var info_window = new google.maps.InfoWindow(); var markers = []; function load_markers() { var bounds_url = map.getBounds().toUrlValue(); $.ajax({ url:'/retailer-markers?bounds='+bounds_url, dataType: 'json', success: function(data) { for(i = 0; i < data.length; i++) { var marker_pos = new google.maps.LatLng(data[i]['lat'], data[i]['long']); //Every time the listener event is called this number is the length of the array var marker_num = get_markers_count(); markers[marker_num] = new google.maps.Marker({ position: marker_pos, map: map, title:data[i]['Title'], icon: image }); google.maps.event.addListener(markers[marker_num], 'click', function() { info_window.setContent('hello'); var pos = markers[marker_num].getPosition(); info_window.setPosition(pos); info_window.open(map, markers[marker_num]); }); } } }); } 

Answer 1

The solution was to use this for marker information. Any other variables can be set to the marker using marker.set('some_var', data);

 $.ajax({ url:'/retailer-markers?bounds='+bounds_url, dataType: 'json', success: function(data) { for(i = 0; i < data.length; i++) { var info_window = get_info_window(); var marker_pos = new google.maps.LatLng(data[i]['lat'], data[i]['long']); marker_num = get_markers_count(); marker = new google.maps.Marker({ position: marker_pos, map: map, title:data[i]['Title'], icon: image }); markers.push(marker); marker.set('retailer', data[i]); google.maps.event.addListener(marker, 'click', function() { var retailer = this.get('retailer'); info_window.setContent(retailer['name']); info_window.open(map, this); }); } } });