javascript - 我可以减慢 OpenSeaDragon 平移/缩放动画的速度吗？

Question

OpenSeaDragon 太棒了。

如果我使用 Viewport#fitBounds JS 方法移动到一个新的矩形，并使用默认参数，它会“动画”当前 View 和新请求的边界之间的过渡。

有什么办法可以控制这个动画的速度吗？我想放慢速度，这样从当前 View 移动到请求的范围需要更长的时间，以实现更悠闲的游览。

Answer 1

您可以在创建 OSD 查看器时设置animationTime 和/或 springStiffness。但这也会影响使用鼠标(或触摸板/屏幕等)手动平移和缩放时的用户体验。当我按照自己的意愿放慢速度时，手动平移/缩放体验令人不安且困难。

但是我想出了这个技巧，可以在执行 #fitBounds 时临时更改animationTime(或者也可能更改 springStiffness)，然后将其恢复到完成后的状态。

// temporarily set OpenSeadragon animation params
// to a very slow animate, then restore.
function withSlowOSDAnimation(viewport, f) {

// save old ones
var oldValues = {};
oldValues.centerSpringXAnimationTime = viewport.centerSpringX.animationTime;
oldValues.centerSpringYAnimationTime = viewport.centerSpringY.animationTime;
oldValues.zoomSpringAnimationTime = viewport.zoomSpring.animationTime;

// set our new ones
viewport.centerSpringX.animationTime =
  viewport.centerSpringY.animationTime =
  viewport.zoomSpring.animationTime =
  6;

// callback
f()

// restore values
viewport.centerSpringX.animationTime = oldValues.centerSpringXAnimationTime;
viewport.centerSpringY.animationTime = oldValues.centerSpringYAnimationTime;
viewport.zoomSpring.animationTime = oldValues.zoomSpringAnimationTime;
}

使用如下:

withSlowOSDAnimation(viewer.viewport, function() {
  // stuff
  viewer.viewport.fitBounds(somebounds);
});

虽然我不确定我是否使用可能会发生变化的内部 API，但这是可行的。对于 OpenSeadragon 来说，这可能是一个很好的附加功能，能够通过 fitBounds 调用提供animationTime、springStiffness 和/或一些 OpenSeadragon.Spring 对象，以应用于该 fitBounds 。