Support anchor for resolution animations

This commit is contained in:
Tim Schaub
2016-11-05 20:41:40 -06:00
parent 8529a74063
commit c95aa39dde
3 changed files with 23 additions and 24 deletions

View File

@@ -667,7 +667,7 @@ olx.ViewOptions.prototype.zoomFactor;
* zoom: (number|undefined), * zoom: (number|undefined),
* resolution: (number|undefined), * resolution: (number|undefined),
* rotation: (number|undefined), * rotation: (number|undefined),
* rotationAnchor: (ol.Coordinate|undefined), * anchor: (ol.Coordinate|undefined),
* duration: (number|undefined), * duration: (number|undefined),
* easing: (function(number):number|undefined) * easing: (function(number):number|undefined)
* }} * }}
@@ -710,11 +710,11 @@ olx.AnimationOptions.prototype.rotation;
/** /**
* The rotation anchor of the view during the animation. * Optional anchor to remained fixed during a rotation or resolution animation.
* @type {ol.Coordinate|undefined} * @type {ol.Coordinate|undefined}
* @api * @api
*/ */
olx.AnimationOptions.prototype.rotationAnchor; olx.AnimationOptions.prototype.anchor;
/** /**

View File

@@ -208,26 +208,20 @@ ol.interaction.Interaction.zoomWithoutConstraints = function(map, view, resoluti
var currentResolution = view.getResolution(); var currentResolution = view.getResolution();
var currentCenter = view.getCenter(); var currentCenter = view.getCenter();
if (currentResolution !== undefined && currentCenter && if (currentResolution !== undefined && currentCenter &&
resolution !== currentResolution && resolution !== currentResolution && opt_duration) {
opt_duration && opt_duration > 0) { view.animate({
map.beforeRender(ol.animation.zoom({ resolution: resolution,
resolution: currentResolution, anchor: opt_anchor,
duration: opt_duration, duration: opt_duration,
easing: ol.easing.easeOut easing: ol.easing.easeOut
})); });
} else {
if (opt_anchor) { if (opt_anchor) {
map.beforeRender(ol.animation.pan({ var center = view.calculateCenterZoom(resolution, opt_anchor);
source: currentCenter, view.setCenter(center);
duration: opt_duration,
easing: ol.easing.easeOut
}));
} }
view.setResolution(resolution);
} }
if (opt_anchor) {
var center = view.calculateCenterZoom(resolution, opt_anchor);
view.setCenter(center);
}
view.setResolution(resolution);
} }
}; };

View File

@@ -203,6 +203,7 @@ ol.View.prototype.animate = function(var_args) {
var animation = /** @type {ol.ViewAnimation} */ ({ var animation = /** @type {ol.ViewAnimation} */ ({
start: start, start: start,
done: false, done: false,
anchor: options.anchor,
duration: options.duration || 1000, duration: options.duration || 1000,
easing: options.easing || ol.easing.inAndOut easing: options.easing || ol.easing.inAndOut
}); });
@@ -227,7 +228,6 @@ ol.View.prototype.animate = function(var_args) {
if (options.rotation !== undefined) { if (options.rotation !== undefined) {
animation.sourceRotation = rotation; animation.sourceRotation = rotation;
animation.targetRotation = options.rotation; animation.targetRotation = options.rotation;
animation.rotationAnchor = options.rotationAnchor;
rotation = animation.targetRotation; rotation = animation.targetRotation;
} }
@@ -304,17 +304,22 @@ ol.View.prototype.updateAnimations_ = function() {
this.set(ol.View.Property.CENTER, [x, y]); this.set(ol.View.Property.CENTER, [x, y]);
} }
if (animation.sourceResolution) { if (animation.sourceResolution) {
var resolutionDelta = progress * (animation.targetResolution - animation.sourceResolution); var resolution = animation.sourceResolution +
this.set(ol.View.Property.RESOLUTION, animation.sourceResolution + resolutionDelta); progress * (animation.targetResolution - animation.sourceResolution);
if (animation.anchor) {
this.set(ol.View.Property.CENTER,
this.calculateCenterZoom(resolution, animation.anchor));
}
this.set(ol.View.Property.RESOLUTION, resolution);
} }
if (animation.sourceRotation !== undefined) { if (animation.sourceRotation !== undefined) {
var rotationDelta = progress * (animation.targetRotation - animation.sourceRotation); var rotationDelta = progress * (animation.targetRotation - animation.sourceRotation);
this.set(ol.View.Property.ROTATION, animation.sourceRotation + rotationDelta); this.set(ol.View.Property.ROTATION, animation.sourceRotation + rotationDelta);
if (animation.rotationAnchor) { if (animation.anchor) {
var center = this.getCenter().slice(); var center = this.getCenter().slice();
ol.coordinate.sub(center, animation.rotationAnchor); ol.coordinate.sub(center, animation.anchor);
ol.coordinate.rotate(center, rotationDelta); ol.coordinate.rotate(center, rotationDelta);
ol.coordinate.add(center, animation.rotationAnchor); ol.coordinate.add(center, animation.anchor);
this.set(ol.View.Property.CENTER, center); this.set(ol.View.Property.CENTER, center);
} }
} }