Use ol.control.ZoomFunction

src/ol/base/createmap.js

@@ -13,6 +13,7 @@ goog.require('ol.control.KeyboardZoom');
 goog.require('ol.control.MouseWheelZoom');
 goog.require('ol.control.ShiftDragRotateAndZoom');
 goog.require('ol.control.ShiftDragZoom');
+goog.require('ol.control.ZoomFunction');
 goog.require('ol.dom');
 goog.require('ol.dom.Map');
 goog.require('ol.webgl');
@@ -75,15 +76,19 @@ ol.createMap = function(target, opt_values, opt_rendererHints) {
     goog.object.extend(values, opt_values);
   }
 
+  // FIXME this should be a configuration option
+  var zoomFunction = ol.control.ZoomFunction.createSnapToPower(
+      2, ol.Projection.EPSG_3857_HALF_SIZE / 128);
+
   if (!goog.object.containsKey(values, ol.MapProperty.CONTROLS)) {
     var controls = new ol.Collection();
-    controls.push(new ol.control.DblClickZoom());
+    controls.push(new ol.control.DblClickZoom(zoomFunction));
     controls.push(new ol.control.DragPan());
     controls.push(new ol.control.KeyboardPan());
-    controls.push(new ol.control.KeyboardZoom());
+    controls.push(new ol.control.KeyboardZoom(zoomFunction));
-    controls.push(new ol.control.MouseWheelZoom());
+    controls.push(new ol.control.MouseWheelZoom(zoomFunction));
-    controls.push(new ol.control.ShiftDragRotateAndZoom());
+    controls.push(new ol.control.ShiftDragRotateAndZoom(zoomFunction));
-    controls.push(new ol.control.ShiftDragZoom());
+    controls.push(new ol.control.ShiftDragZoom(zoomFunction));
     values[ol.MapProperty.CONTROLS] = controls;
   }
 

src/ol/control/dblclickzoom.js

@@ -3,15 +3,25 @@ goog.provide('ol.control.DblClickZoom');
 goog.require('goog.events.EventType');
 goog.require('ol.Control');
 goog.require('ol.MapBrowserEvent');
+goog.require('ol.control.ZoomFunctionType');
 
 
 
 /**
  * @constructor
  * @extends {ol.Control}
+ * @param {ol.control.ZoomFunctionType} zoomFunction Zoom function.
  */
-ol.control.DblClickZoom = function() {
+ol.control.DblClickZoom = function(zoomFunction) {
+
   goog.base(this);
+
+  /**
+   * @private
+   * @type {ol.control.ZoomFunctionType}
+   */
+  this.zoomFunction_ = zoomFunction;
+
 };
 goog.inherits(ol.control.DblClickZoom, ol.Control);
 
@@ -27,9 +37,10 @@ ol.control.DblClickZoom.prototype.handleMapBrowserEvent =
       // FIXME compute correct center for zoom
       map.setCenter(mapBrowserEvent.getCoordinate());
       var browserEvent = mapBrowserEvent.browserEvent;
-      var scale = browserEvent.shiftKey ? 2 : 0.5;
+      var delta = browserEvent.shiftKey ? -1 : 1;
-      map.setResolution(scale * map.getResolution());
+      var resolution = this.zoomFunction_(map.getResolution(), delta);
-    });
+      map.setResolution(resolution);
+    }, this);
     mapBrowserEvent.preventDefault();
   }
 };

src/ol/control/keyboardzoom.js

@@ -3,15 +3,25 @@ goog.provide('ol.control.KeyboardZoom');
 goog.require('goog.events.KeyCodes');
 goog.require('goog.events.KeyHandler.EventType');
 goog.require('ol.Control');
+goog.require('ol.control.ZoomFunctionType');
 
 
 
 /**
  * @constructor
  * @extends {ol.Control}
+ * @param {ol.control.ZoomFunctionType} zoomFunction Zoom function.
  */
-ol.control.KeyboardZoom = function() {
+ol.control.KeyboardZoom = function(zoomFunction) {
+
   goog.base(this);
+
+  /**
+   * @private
+   * @type {ol.control.ZoomFunctionType}
+   */
+  this.zoomFunction_ = zoomFunction;
+
 };
 goog.inherits(ol.control.KeyboardZoom, ol.Control);
 
@@ -27,13 +37,8 @@ ol.control.KeyboardZoom.prototype.handleMapBrowserEvent =
     var charCode = keyEvent.charCode;
     if (charCode == '+'.charCodeAt(0) || charCode == '-'.charCodeAt(0)) {
       var map = mapBrowserEvent.map;
-      // FIXME shouldn't use typecast here, better to check that map is defined
+      var delta = charCode == '+'.charCodeAt(0) ? 1 : -1;
-      var resolution = /** @type {number} */ map.getResolution();
+      var resolution = this.zoomFunction_(map.getResolution(), delta);
-      if (charCode == '+'.charCodeAt(0)) {
-        resolution = resolution / 2;
-      } else if (charCode == '-'.charCodeAt(0)) {
-        resolution = 2 * resolution;
-      }
       map.setResolution(resolution);
       keyEvent.preventDefault();
       mapBrowserEvent.preventDefault();

src/ol/control/mousewheelzoom.js

@@ -3,15 +3,25 @@ goog.provide('ol.control.MouseWheelZoom');
 goog.require('goog.events.MouseWheelEvent');
 goog.require('goog.events.MouseWheelHandler.EventType');
 goog.require('ol.MapBrowserEvent');
+goog.require('ol.control.ZoomFunctionType');
 
 
 
 /**
  * @constructor
  * @extends {ol.Control}
+ * @param {ol.control.ZoomFunctionType} zoomFunction Zoom function.
  */
-ol.control.MouseWheelZoom = function() {
+ol.control.MouseWheelZoom = function(zoomFunction) {
+
   goog.base(this);
+
+  /**
+   * @private
+   * @type {ol.control.ZoomFunctionType}
+   */
+  this.zoomFunction_ = zoomFunction;
+
 };
 goog.inherits(ol.control.MouseWheelZoom, ol.Control);
 
@@ -31,9 +41,10 @@ ol.control.MouseWheelZoom.prototype.handleMapBrowserEvent =
       map.withFrozenRendering(function() {
         // FIXME compute correct center for zoom
         map.setCenter(mapBrowserEvent.getCoordinate());
-        var scale = mouseWheelEvent.deltaY < 0 ? 0.5 : 2;
+        var delta = mouseWheelEvent.deltaY < 0 ? 1 : -1;
-        map.setResolution(scale * map.getResolution());
+        var resolution = this.zoomFunction_(map.getResolution(), delta);
-      });
+        map.setResolution(resolution);
+      }, this);
       mapBrowserEvent.preventDefault();
       mouseWheelEvent.preventDefault();
     }

src/ol/control/shiftdragrotateandzoom.js

@@ -3,15 +3,25 @@ goog.provide('ol.control.ShiftDragRotateAndZoom');
 goog.require('goog.math.Vec2');
 goog.require('ol.MapBrowserEvent');
 goog.require('ol.control.Drag');
+goog.require('ol.control.ZoomFunctionType');
 
 
 
 /**
  * @constructor
  * @extends {ol.control.Drag}
+ * @param {ol.control.ZoomFunctionType=} opt_zoomFunction Zoom function.
  */
-ol.control.ShiftDragRotateAndZoom = function() {
+ol.control.ShiftDragRotateAndZoom = function(opt_zoomFunction) {
+
   goog.base(this);
+
+  /**
+   * @private
+   * @type {ol.control.ZoomFunctionType|undefined}
+   */
+  this.zoomFunction_ = opt_zoomFunction;
+
 };
 goog.inherits(ol.control.ShiftDragRotateAndZoom, ol.control.Drag);
 
@@ -37,7 +47,6 @@ ol.control.ShiftDragRotateAndZoom.prototype.handleDrag =
     function(mapBrowserEvent) {
   var browserEvent = mapBrowserEvent.browserEvent;
   var map = mapBrowserEvent.map;
-  var resolution = map.getResolution();
   var size = map.getSize();
   var delta = new goog.math.Vec2(
       browserEvent.offsetX - size.width / 2,
@@ -45,7 +54,11 @@ ol.control.ShiftDragRotateAndZoom.prototype.handleDrag =
   var theta = Math.atan2(delta.y, delta.x);
   // FIXME this should use map.withFrozenRendering but an assertion fails :-(
   map.setRotation(this.startRotation_ - theta);
-  map.setResolution(this.startRatio_ * delta.magnitude());
+  var resolution = this.startRatio_ * delta.magnitude();
+  if (goog.isDef(this.zoomFunction_)) {
+    resolution = this.zoomFunction_(resolution, 0);
+  }
+  map.setResolution(resolution);
 };
 
 

src/ol/control/shiftdragzoom.js

@@ -5,6 +5,7 @@ goog.provide('ol.control.ShiftDragZoom');
 goog.require('ol.Extent');
 goog.require('ol.MapBrowserEvent');
 goog.require('ol.control.Drag');
+goog.require('ol.control.ZoomFunctionType');
 
 
 /**
@@ -24,9 +25,18 @@ ol.SHIFT_DRAG_ZOOM_HYSTERESIS_PIXELS_SQUARED =
 /**
  * @constructor
  * @extends {ol.control.Drag}
+ * @param {ol.control.ZoomFunctionType=} opt_zoomFunction Zoom function.
  */
-ol.control.ShiftDragZoom = function() {
+ol.control.ShiftDragZoom = function(opt_zoomFunction) {
+
   goog.base(this);
+
+  /**
+   * @private
+   * @type {ol.control.ZoomFunctionType|undefined}
+   */
+  this.zoomFunction_ = opt_zoomFunction;
+
 };
 goog.inherits(ol.control.ShiftDragZoom, ol.control.Drag);
 
@@ -37,10 +47,18 @@ goog.inherits(ol.control.ShiftDragZoom, ol.control.Drag);
 ol.control.ShiftDragZoom.prototype.handleDragEnd = function(mapBrowserEvent) {
   if (this.deltaX * this.deltaX + this.deltaY * this.deltaY >=
       ol.SHIFT_DRAG_ZOOM_HYSTERESIS_PIXELS_SQUARED) {
+    var map = mapBrowserEvent.map;
     var extent = ol.Extent.boundingExtent(
         this.startCoordinate,
         mapBrowserEvent.getCoordinate());
-    mapBrowserEvent.map.fitExtent(extent);
+    var resolution = map.getResolutionForExtent(extent);
+    if (goog.isDef(this.zoomFunction_)) {
+      resolution = this.zoomFunction_(resolution, 0);
+    }
+    map.withFrozenRendering(function() {
+      map.setCenter(extent.getCenter());
+      map.setResolution(resolution);
+    });
   }
 };