1

I found formula only for vector coordinates of cubic curve who help in depicts(build vector image).

Here it is:

B(t) = (1-t)^3*P0 + 3*t*(1-t)^2*P1 + 3*t^2*(1-t)*P2 + t^3*P3

This formula returns the coordinates of the vector, but I can not understand how they can influence the speed of the animation, as in http://cubic-bezier.com/#.17,.67,.83,.67.

Please, direct me to the right way so that I could understand.

CodeSmile
  • 64,284
  • 20
  • 132
  • 217
tkachenko-vladislav
  • 51
  • 5

1 Answers1

1

bezier curve is a mapping from linear space (usually on interval <0,1>) to nonlinear space. This means you can use it for shape distortion of any signal/value. In your case is not affected time but speed (first derivation of position)

How to do it:

There are many approaches I think that one is done:

If control points of bezier are evenly distributed along the path then the movement is linear. When they are more dense there is the speed slower and vice versa. If you need more complicated movement add more points/bezier patches.

Another option is make the movement linear but not the time


x(t) = x0 + (x1-x0)*t/t_duration;
x(t) is animated item position
t is animation time <0,t_duration>
t_duration is time needed to get to edge position
x0,x1 are start/end positions

now if you increment the time in timer linearly then movement is linear if you do this instead:

u=Bezier(t/t_duration)*t_duration;

and use u instead of t then you achieve the same ... To be clear inside Bezier is time converted to range <0,1> and after back to <0,t_duration>

[notes]

The second option (discrete nonlinear time) brings a whole world of new math problems.

But I use it a lot in advanced motion control and planing. You can achieve nasty things in there that are almost impossible in standard time space with very small complexity instead. But the draw back is that the simple things in classical time space are very hard to do there.

Spektre
  • 49,595
  • 11
  • 110
  • 380
  • Maybe you have some book or article about manipulation the speed in modern animation/physical engines? I need to deep learn this, because it closely related to my work) But I can not find comprehensive information on this subject. Thanks. – tkachenko-vladislav Nov 25 '14 at 18:28
  • Okay, maybe i find this equation in core of JS libraries for animation) – tkachenko-vladislav Nov 25 '14 at 22:44
  • if you want just manipulate time then that is easy (i compute driving signals to drive/control complex systems in RT). your engine input is time t,... so instead of linear time use nonlinear `t_nonlinear=f_some_curve_function(t_linear);` t_linear can be increased linearly (by timer or scrollbar or whatever) and the shape of f_curve function will determine your animation time you can use any 1D bezier or interpolation polynom ... – Spektre Nov 26 '14 at 09:17