So I've created a map in openlayers and I am setting it up so that there are only certain zoom levels a user can see. I have the code created to handle forcing a user to the next acceptable zoom level when they attempt to zoom in/out. I have been able to create listener for handling double-clicks (see code below) but for the life of me I cannot figure out how to capture mousewheel events.

The documentation makes it seem like it should be straightforward but I've been banging my head against a wall for more than a day trying to figure this out. All my googling has turned up plenty of results for disabling the mousewheel but nothing for capturing wheel events.

function init() {
    map = new OpenLayers.Map('map_canvas',mapSettings);

    var click = new OpenLayers.Control.Click();

OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, {
    defaultHandlerOptions: {
    'single': false,
    'double': true,
    'pixelTolerance': 0,
    'stopSingle': false,
    'stopDouble': false

    initialize: function(options) {
        this.handlerOptions = OpenLayers.Util.extend(
        {}, this.defaultHandlerOptions
        this, arguments
        this.handler = new OpenLayers.Handler.Click(
        this, {
        'dblclick': this.trigger
        }, this.handlerOptions

    trigger: function(e) {
        var lonlat = map.getLonLatFromViewPortPx(e.xy);
        curZoom = map.getZoom();
        var newZoom = stepZoomIn(map.getZoom());


3 Answers 3


I was able to accomplish this by defining my own control derived from Navigation control.

var NavigationControl = OpenLayers.Class(OpenLayers.Control.Navigation, {
  wheelDown: function(evt, delta) {
    if (canZoomOut()) {
      return OpenLayers.Control.Navigation.prototype.wheelDown.apply(this,arguments);
    } else {
      console.log('Blocked user of zooming out');

map.addControl(new NavigationControl());

This of course will work only as long as Navigation control defines wheelDown - function. If Navigation control is modified in later OpenLayers version then this will brake as well.


OpenLayers has a mousewheel handler. You might want to check it out.

  • Thanks for the link/response. I have actually read through the docs a bunch of times and spent hours trying to use it but just cannot seem to wrap my brain around it. I've tried googling as well but that got me nowhere. Case in point, my gis.SE question shows up - for me - as the 6th result when searching for "openlayers mousewheel handler" google.com/search?q=openlayers+mousewheel+handler. The first 4 results are to documentation and the 5th is how to make a custom build of OL.
    – malonso
    Commented Feb 12, 2012 at 14:59

This is now built-in to openlayers3 with https://openlayers.org/en/latest/apidoc/ol.interaction.MouseWheelZoom.html

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.