I am developing a web application that uses Bing maps 7.0. I was wondering if there was a way to bind a function to a Map
class event that listens for when the map is either dragged or zoomed. From what I see in the documentation, the viewchangeend
event for the Map class is close to what I am looking for, however this event is called in situations that I do not particularly want to account for, such as if I hide the map's containing div using jQuery or on map creation/initialization. Ideally, I would also like this to be a throttled event, where the handler function gets called after a given amount of time. Any idea on how this could be implemented?
Update
As suggested by psousa, I used the viewchangeend
event.
This is the hack around that I tried implementing to sort of try and detect if the map has zoomed or been dragged. I still bind the handler to the viewchangeend
event, but this time I check to see if the Northwest coordinates or Southeast coordinates of the map have changed.
var map; // contains Microsoft.Maps.Map instance
var nw; // contains the NW Microsoft.Maps.LocationRect instance
var se; // contains the SE Microsoft.Maps.LocationRect instance
// initialization code goes here some where
Microsoft.Maps.Events.addThrottledHandler(map, "viewchangeend", function(arg) {
var curNW = map.getBounds().getNorthwest();
var curSE = map.getBounds().getSoutheast();
if (nw.latitude != curNW.latitude ||
nw.longitude != curNW.longitude ||
se.latitude != curSE.latitude ||
se.longitude != curSE.longitude)
{
nw = curNW;
se = curSE;
// Execute actual handler code here
}
}, 1000);
This code does not work as I had intended. As I'm debugging the code, if I go and hide the map's containing div (using jQuery), I notice that curNW
and and curSE
do not have the same coordinates as the ones I stored on the previous call. Why is this if I never dragged the map around or zoomed in or out? I am just hiding the map, why would the map's coordinates change? It makes no sense to me. Ideally, I wish Bing maps would provide developers with a zoomend
or dragend
event so I can say:
Microsoft.Maps.Map.addThrottledHandler(map, "zoomend", handler, 1000);
Microsoft.Maps.Map.addThrottledHandler(map, "dragend", handler, 1000);
Google Maps I believe provides this functionality. If anyone knows a better way to check for these events, please let me know. I don't want to add additional handlers to the elements of the page that may trigger a viewchangeend
as there is way to much stuff going on in this page as it is. Appreciate the help.
The viewchangeend
and viewchange
are the best events for that, so no great alternative there.
Anyway, you have out-of-the-box support for throttled events. So, instead of:
Microsoft.Maps.Events.addHandler(map, 'viewchangeend', handler);
you can just use (the last argument uses milliseconds):
Microsoft.Maps.Events.addThrottledHandler(map, 'viewchangeend', handler, 500);
Reference: http://msdn.microsoft.com/en-us/library/gg427623.aspx