【问题标题】:Deceleration Timing减速时间
【发布时间】:2012-02-05 03:00:34
【问题描述】:

我目前正在编写Flow Slider plugin 的第二个版本,其中一个动画选项是当滑块以某个恒定加速度加速到某个最大速度,然后以恒定减速度减速时。我无法找到开始减速的正确时机。

如果时间是连续的,则没有问题,但时间以离散的间隔移动,因此当移动加速时会有一些帧,并且(使用连续时间数学)您不需要开始减速,但是在下一帧你已经来不及减速了。

例如,假设我们的帧速率为每秒 20 帧。我们需要移动500px,起始速度0px/帧,最大速度50px/帧,加速度3px/帧,减速3px/帧。下面你可以看到系统的前 13 帧。

| frame | speed | traveled | to go | deceleration distance |
|-----------------------------------------------------------
|   1   |   3   |   3      |   497 |   3                   |
|   2   |   6   |   9      |   491 |   9                   |
|   3   |   9   |   18     |   482 |   18                  |
|   4   |   12  |   30     |   470 |   30                  |
|   5   |   15  |   45     |   455 |   45                  |
|   6   |   18  |   63     |   437 |   63                  |
|   7   |   21  |   84     |   416 |   84                  |
|   8   |   24  |   108    |   392 |   108                 |
|   9   |   27  |   135    |   365 |   135                 |
|   10  |   30  |   165    |   335 |   165                 |
|   11  |   33  |   198    |   302 |   198                 |
|   12  |   36  |   234    |   266 |   234                 |
|   13  |   39  |   273    |   227 |   273                 |
|-----------------------------------------------------------

现在,您可以看到在 0.6 秒(第 12 帧)减速还为时过早,因为 234 的 减速距离 小于 266 的 to go 距离. 但是已经在下一帧(第 13 帧)中,减速距离远大于要走的距离,如果我们从那里开始减速,我们将无法完成时间。

解决这个问题的最佳策略是什么?

【问题讨论】:

  • 您的 flowlider 文档不错

标签: javascript jquery motion acceleration


【解决方案1】:

您可以尝试在“为时已晚”的帧中调整减速速度,使其适合更小的距离。

【讨论】:

    猜你喜欢
    • 2011-11-28
    • 2014-03-13
    • 2018-03-23
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-03-21
    • 2021-04-21
    • 2020-10-18
    相关资源
    最近更新 更多