I have a google map with markers. I want my markers to be refreshed when the map is moved/zoomed...
Google recommend to use the event bounds_changed for that, but when I move the map, the event is triggered for each pixel that I move the map. I want the map to be refreshed only when the user stopped moving the map, i.e. when he released the mouse button after dragging.
How can I do that ?
It turns out it was a reported bug: http://code.google.com/p/gmaps-api-issues/issues/detail?id=1371.
The Google team recommend to use the event "idle". For example :
google.maps.event.addListener(map, 'idle', function() {
});
Add a timeout, that runs your code 500ms after the event fires, each time the event fires clear the timeout and create a new one.
google.maps.event.addListener(map, 'bounds_changed', (function () {
var timer;
return function() {
clearTimeout(timer);
timer = setTimeout(function() {
// here goes an ajax call
}, 500);
}
}()));