Curves

8 Sept 2022

Notes Computer Animation Curves

§ Motivation

Keyframe

Often in computer animation, an artist creates keyframes which is the state (position, rotation, scale, etc.) at a discrete time step.

Then, an algorithm takes these keyframes and interpolates between them to accomplish a (typically) smooth transition between the keyframes .

Almost anything can be keyframed.

Keyframing: Position and Orientation over Time

An artist may provide positions at timesteps t1,t2,t_1, t_2, and t3t_3 and we generate a curve between them to get the position at any time between t1t_1 and t3.t_3.

Keyframing: Joint Angles

We can model an arm and its movement using joint angles θ1,θ2,\theta_1, \theta_2, and θ3.\theta_3.

Then, we can define θi(t)\theta_i(t) to describe how the angles change with respect to time.

This then leaves us with the question of how we would interpolate between keyframes?

§ Representation of Curves

There are a few ways to express a curve:

Type Form Example for Circle
Explicit y=f(x)y = f(x) y=±1−x2y = \pm \sqrt{1 - x^2}
Implicit f(x,y)=0f(x, y) = 0 x2+y2−1=0x^2 + y^2 - 1 = 0
Parametric x=f(t),y=g(t)x = f(t), y = g(t) x=cos⁡t,y=sin⁡tx = \cos t, y = \sin t

§ Explicit

  • Easy to Generate
  • Only one value of yy for each xx
  • Heavily dependent on choice of independent variable

§ Implicit

  • f(x,y)f(x, y) is a measure of the distance of a point to curve (level-set information).
  • Difficult to generate points on a curve

§ Parametric

  • Easy to generate points on a curve
  • Can have multiple yy for a given xx

§ Cubic Bézier Curve

Cubic Bézier Curve

Specify 4 "control" points, (a0,b0),…,(a3,b3),(a_0, b_0), \dots, (a_3, b_3), then the cubic Bézier can be given in parametric form by

x(u)=a0+a1u+a2u2+a3u3y(u)=b0+b1u+b2u2+b3u3\begin{align*} x(u) &= a_0 + a_1u + a_2u^2 + a_3u^3\\ y(u) &= b_0 + b_1u + b_2u^2 + b_3u^3 \end{align*}

Alternatively in vector notation:

p⃗(u)=(1−u)3p⃗0+3u(1−u)2p⃗1+3u2(1−u)p⃗2+u3p⃗3p⃗(0)=p⃗0, p⃗(1)=p⃗3\begin{align*} \vec{p}(u) &= (1-u)^3\vec{p}_0 + 3u(1-u)^2\vec{p}_1 + 3u^2(1-u)\vec{p}_2 + u^3\vec{p}_3\\ \vec{p}(0) &= \vec{p}_0,\ \vec{p}(1) = \vec{p}_3 \end{align*}

And in matrix form:

p⃗(u)=(p⃗0p⃗1p⃗2p⃗3)⏟G(1−33−103−63003−30001)⏟B(1uu2u3)⏟u⃗p⃗(u)=GB⏟cubic Bezier basisu⃗\begin{align*} \vec{p}(u) &= \underbrace{\begin{pmatrix} \vec{p}_0 & \vec{p}_1 & \vec{p}_2 & \vec{p}_3 \end{pmatrix}}_{G} \underbrace{\begin{pmatrix} 1&-3&3&-1\\ 0&3&-6&3\\ 0&0&3&-3\\ 0&0&0&1 \end{pmatrix}}_{B} \underbrace{\begin{pmatrix} 1\\ u\\ u^2\\ u^3 \end{pmatrix}}_{\vec{u}}\\ \vec{p}(u) &= G\underbrace{B}_{\mathclap{\textrm{cubic Bezier basis}}}\vec{u} \end{align*}

  • Why use 4 control points?
  • The parametric equations have 8 unknowns; each point gives us 2 pieces of information.

§ Continuity in Concatenated Bézier Curves

There different classes of curve continuity

  • C0C^0, the curves are connected
  • C1C^1, tangents are the same
  • G1G^1, tagent directions are the same

They can be visualised with the following illustration

CnC^n and GnG^n are families of curves where the nnth derivative matches, but for animation C2C^2 or G2G^2 is good enough in most cases.

§ Cubic Catmull-Rom Spline

Catmull-Rom Spline

The Catmull-Rom spline is a C1C^1 curve, but it is not C2C^2. Specifically, not C2C^2 at its control points

The basis for the Catmull-Rom spline can be given by

B=12(0−12−120−53014−300−11)B = \frac{1}{2} \begin{pmatrix} 0 & -1 & 2 & -1\\ 2 & 0 & -5 & 3\\ 0 & 1 & 4 & -3\\ 0 & 0 & -1 & 1 \end{pmatrix}

Connecting Sequence of Control Points

Connecting a sequence of 3D/2D points can be done using a Catmull-Rom spline.

p⃗(u)=⟨p⃗0, p⃗1, p⃗2⏞the curve passes through the middle 2 points, p⃗3⟩B u⃗, u∈[0,1]p⃗(u)=⟨p⃗1, p⃗2, p⃗3, p⃗4⟩B u⃗, u∈[0,1]p⃗(u)=⟨p⃗2, p⃗3, p⃗4, p⃗5⟩B u⃗, u∈[0,1]\begin{align*} \vec{p}(u) &= \langle\vec{p}_0,\ \overbrace{\vec{p}_1,\ \vec{p}_2}^{\mathclap{\text{the curve passes through the middle 2 points}}},\ \vec{p}_3\rangle B\,\vec{u},\ u \in [0, 1]\\ \vec{p}(u) &= \langle\vec{p}_1,\ \vec{p}_2,\ \vec{p}_3,\ \vec{p}_4\rangle B\,\vec{u},\ u \in [0, 1]\\ \vec{p}(u) &= \langle\vec{p}_2,\ \vec{p}_3,\ \vec{p}_4,\ \vec{p}_5\rangle B\,\vec{u},\ u \in [0, 1] \end{align*}

  • Every set of 4 control points define a segment of the curve
  • "Concatenated" uu goes from [0,n−3][0, n - 3] where nn is the number of control points.
  • To convert between uu concatenated to u^∈[0,1]\hat{u} \in [0, 1]

k=⌊u⌋u^=uk=u−kG=[p⃗k,p⃗k+1,p⃗k+2,p⃗k+3]4×4\begin{align*} k &= \lfloor u\rfloor\\ \hat{u} &= u_k = u - k\\ G &= \big[\vec{p}_k, \vec{p}_{k+1}, \vec{p}_{k+2}, \vec{p}_{k+3}\big]_{4 \times 4} \end{align*}

Then, the curve can be computed using

p⃗(u)=GkBuk⃗,u∈[0,n−1]\vec{p}(u) = G_kB\vec{u_k}, u \in [0, n - 1]

where nn is the number of control points.