【发布时间】: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