Javascript OpenLayers before zoom event listener

Question

I am trying to set up OpenLayers to not display the vector layer just before a zoom starts and make it reappear after a zoom ends. I have the zoom ends part already established like this:

map = new OpenLayers.Map('map_element', { eventListeners: { "zoomend": mapEvent}});

function mapEvent(event) {
    if(event.type == "zoomend") {
        hide_vector_layer();
        }
}

But I don't see any kind of event listener for the start of a zoom in the documentation. There is a "movestart" which covers moving, panning, and zoom. Unfortunately, I can't use the "movestart" one, because I don't want the layer to disappear during a pan. You would think there would be a "zoomstart", as there is a "zoomend".

The reason I am trying to do this, is because I don't like how the vector layer zooms at a different rate when using Google Maps as a base layer. It looks wrong, looks like all the features are inaccurate, even though they land in the right place after the zoom is complete.

Any suggestions?

Answer 1

Here is a easy to add the 'BeforeZoom' event to the OpenLayers . Just add the code below to where you created your map object.

map.zoomToProxy = map.zoomTo;
map.zoomTo =  function (zoom,xy){
    //Your Before Zoom Actions

    //If you want zoom to go through call
    map.zoomToProxy(zoom,xy); 
    //else do nothing and map wont zoom
};

How this works:

For any kind of zooming activity, OpenLayers API ultimately calls the function called zoomTo. So before overriding it, we copy that function to a new function called 'zoomToProxy'. The we override it and add our conditional zoom logic. If we want the zoom to happen we just call new proxy function :)

Answer 2

For this purpose you should override moveTo and moveByPx methods of OpenLayers.Map for eliminate movestart event triggering for any actions except zooming.

Answer 3

I had the same problem that OP had, and I tried to solve it with drnextgis's solution. But unfortunately it didn't completely work:: the zoomChanged property in OpenLayers.Map.moveTo evaluates to true not only when the zoom level has changed, but also when the map has been resized.

My map was 100% of the user's browser window, so if they resized the window, the event would be triggered. This was undesirable for me, as I only wanted to trigger the event if the zoom level had actually changed. My solution was to create an new event, called "zoomstart", which I inserted at the top of OpenLayers.Map.moveTo. Here's the code:

var getZoom = this.getZoom();
if ( !!getZoom && !!zoom && this.isValidZoomLevel(zoom) && getZoom != zoom )
    this.events.triggerEvent("zoomstart", zoom);

This code will pass the new zoom level to an event listener that is registered to zoomstart, and in my case I determine the map's restrictedExtent and do other stuff based upon the new zoom level.

Peace be with ye.

Answer 4

"movestart" handles "zoomstart". To detect if the zoomstart, try:

 map.events.register("movestart",map, function(e) {
        if(e.zoomChanged)
        {
        //zoom start code here
        }

    });

Answer 5

Solution of "Shaunak" is worked very well for me. I want to restrict zooming below 11 so edited his code as

if (zoom > 11) {
    map.zoomToProxy(zoom, xy);
}