JS动画中的加速运动如何根据目标值计算速度？

Question

减速缓冲运动可以用 speed = ( 目标值 - 当前值) / 时间 来计算获得，但是缓冲加速运动如何根据目标值来计算速度呢，也就是越靠近目标速度越快 ，到目标后停止。

运动曲线参考图：

分割线-----------------------------------------------------------------------

---

补充答案：
自己试了下基本的加速：
1、先用angle = Math.atan2(y2 - y1,x2 - x1)算出目标点与当前点的距离坐标角度

2、X坐标的vx为Math.cos(angle) speed,Y坐标的vy为Math.sin(angle) speed 分别算出x,y的合适加速值

3、重点:speed *= 1 + 0.03; 速度值不断累加

4、判断对比当前与目标的xy来决定是否继续累加或者停止.

源码参考:

https://jsfiddle.net/95zybtbh/

Answer 1

可以参考这篇博客
还有这篇博客
这个就能解决
关键词tween

Answer 2

谢邀！
你这个方法是直线运行，想先慢后快，要抛物线的吧,比如y=ax^2+z.

Answer 3

变速运动公式：$$v=v_0+at$$

Answer 4

写了个简单匀加速的给你参考下.

https://jsfiddle.net/htddp100/

Answer 5

如果是确定的运动, 一般是从几种插值函数中选一个 (easy-in, easy-out, 阻尼, 等), 调整参数, 然后用 位置(时间) 函数来直接算位置

现场算速度的方式类似于.. 用低精度迭代求微分方程的数值解, 对性能和精度都不利

如果需要现场算, 记得加个"碰撞"检测

Answer 6

嗯，这个问题，有点难。我认为我短时间讲不清楚，

给你推荐一个与运动曲线息息相关的，tween.js，你自己慢慢研究一下试试看吧 ~ ~

sorry!