diff --git a/externs/olx.js b/externs/olx.js index 1792f5eb15..4511a7d872 100644 --- a/externs/olx.js +++ b/externs/olx.js @@ -544,7 +544,8 @@ olx.animation.PanOptions.prototype.easing; /** - * @typedef {{rotation: number, + * @typedef {{rotation: (number|undefined), + * anchor: (ol.Coordinate|undefined), * start: (number|undefined), * duration: (number|undefined), * easing: (function(number):number|undefined)}} @@ -554,12 +555,21 @@ olx.animation.RotateOptions; /** - * The rotation to apply, in radians. - * @type {number} + * The rotation value (in radians) to begin rotating from, typically + * `map.getView().getRotation()`. If `undefined` then `0` is assumed. + * @type {number|undefined} */ olx.animation.RotateOptions.prototype.rotation; +/** + * The rotation center/anchor. The map rotates around the center of the view + * if unspecified. + * @type {ol.Coordinate|undefined} + */ +olx.animation.RotateOptions.prototype.anchor; + + /** * The start time of the animation. Default is immediately. * @type {number|undefined} diff --git a/src/ol/animation.js b/src/ol/animation.js index 938f838db9..eb092506da 100644 --- a/src/ol/animation.js +++ b/src/ol/animation.js @@ -4,6 +4,7 @@ goog.provide('ol.animation'); goog.require('ol.PreRenderFunction'); goog.require('ol.ViewHint'); +goog.require('ol.coordinate'); goog.require('ol.easing'); @@ -92,6 +93,8 @@ ol.animation.rotate = function(options) { var duration = goog.isDef(options.duration) ? options.duration : 1000; var easing = goog.isDef(options.easing) ? options.easing : ol.easing.inAndOut; + var anchor = goog.isDef(options.anchor) ? + options.anchor : null; return ( /** @@ -106,9 +109,15 @@ ol.animation.rotate = function(options) { } else if (frameState.time < start + duration) { var delta = 1 - easing((frameState.time - start) / duration); var deltaRotation = - sourceRotation - frameState.view2DState.rotation; + (sourceRotation - frameState.view2DState.rotation) * delta; frameState.animate = true; - frameState.view2DState.rotation += delta * deltaRotation; + frameState.view2DState.rotation += deltaRotation; + if (!goog.isNull(anchor)) { + var center = frameState.view2DState.center; + ol.coordinate.sub(center, anchor); + ol.coordinate.rotate(center, deltaRotation); + ol.coordinate.add(center, anchor); + } frameState.viewHints[ol.ViewHint.ANIMATING] += 1; return true; } else {