减速时间

时间:2012-01-07 22:57:21

标签: javascript jquery motion acceleration

我目前正在编写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.6s(第12帧)时减速太早,因为234的减速距离小于的距离 266但是已经在下一帧(第13位),减速距离远远大于的距离,如果我们从那里开始减速,我们将无法完成时间。

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

1 个答案:

答案 0 :(得分:0)

您可以尝试在“太晚”的框架中调整减速速度,以便它适合较小的距离。