📗 Velocity is updated by \(v' = A v\), where \(A\) is a rotation matrix, and the rotation angle can be computed by \(arctan\left(\dfrac{v'_{y}}{v'_{x}}\right)\) or atan2(v'y, v'x).
📗 Velocity can also be updated by \(v' = \left\|v\right\| \begin{bmatrix} \cos\left(\theta + \Delta \theta\right) \\ \sin\left(\theta + \Delta \theta\right) \end{bmatrix}\), where \(\left\|v\right\|\) is the constant speed, and \(\theta + \Delta \theta\) is the updated the rotation angle.
📗 \(\begin{bmatrix} x \\ y \end{bmatrix} = f\left(t\right)\) in 2D and \(\begin{bmatrix} x \\ y \\ z \end{bmatrix} = f\left(t\right)\) in 3D, for \(t\) in some 1D interval.
📗 \(f\) is called a vector function (or vector-valued function), and it is usually represented by one function per dimension: Wikipedia.
📗 Reparameterized \(f\left(t\right) = \begin{bmatrix} t \\ 0 \end{bmatrix}\) so that it moves slower as \(t\) increases.
📗 \(f\left(t\right) = \begin{bmatrix} 1 - t \\ 0 \end{bmatrix}\) and \(f\left(t\right) = \begin{bmatrix} t^{2} \\ 0 \end{bmatrix}\) are different parameterizations of the same line segment.
📗 A curve is the image of a 1D interval: it is a set of points.
📗 A parameterization is the mapping from a 1D interval to a space: it is the function.
📗 A convention is that the 1D interval is the unit interval or \(\left[0, 1\right]\), and this is called a unit parameterization, written as \(f\left(u\right), u \in \left[0, 1\right]\).
📗 Reparameterized \(f\left(u\right) = \begin{bmatrix} \cos\left(u\right) \\ \sin\left(u\right) \end{bmatrix}\) so that it traces only half of the circle.
📗 A line segment \(a_{0} + a_{1} u\) can be written as \(\left(1 - u\right) p_{0} + u p_{1}\).
📗 A quadratic polynomial segment \(a_{0} + a_{1} u + a_{2} u^{2}\) can be written as \(\left(1 - u^{2}\right) p_{0} + \left(u - u^{2}\right) p'_{0} + u^{2} p_{1}\), where \(p_{0}\) and \(p_{1}\) are the two endpoints and \(p'_{0}\) is the derivative at \(p_{0}\).
📗 A cubic polynomial segment \(a_{0} + a_{1} u + a_{2} u^{2} + a_{3} u^{3}\) can be written as:
📗 In general, for polynomials, the coefficients or functions of \(u\) in front of the control points are called basis functions: \(f\left(u\right) = b_{0}\left(u\right) p_{0} + b_{1}\left(u\right) p_{1} + b_{2}\left(u\right) p_{2} + ...\).
➩ Basis functions are scalar functions and only depend on \(u\).
➩ There is a separate function for each control points (or control vector when derivatives are used).
Math Notes
Let \(f\left(u\right) = a_{0} + a_{1} u + a_{2} u^{2}\), then
\(p_{0} = f\left(0\right) = a_{0}\), and
\(p_{1} = f\left(1\right) = a_{0} + a_{1} + a_{2}\), and
\(p'_{0} = f'\left(0\right) = a_{1} + 2 a_{2} \cdot 0 = a_{1}\),
solve for \(a_{0}, a_{1}, a_{2}\),
\(a_{0} = p_{0}\), and
\(a_{1} = p'_{0}\), and
\(a_{2} = p_{1} - p_{0} - p'_{0}\),
write this back into \(f\left(u\right)\),
\(f\left(u\right) = p_{0} + p'_{0} u + \left(p_{1} - p_{0} - p'_{0}\right) u^{2}\), or
\(f\left(u\right) = \left(1 - u^{2}\right) p_{0} + \left(u - u^{2}\right) p'_{0} + u^{2} p_{1}\) More Math Notes
Please double-check the algebra! An earlier version of the notes was incorrect!
Let \(f\left(u\right) = a_{0} + a_{1} u + a_{2} u^{2} + a_{3} u^{3}\), then
\(p_{0} = f\left(0\right) = a_{0}\), and
\(p_{1} = f\left(1\right) = a_{0} + a_{1} + a_{2} + a_{3}\), and
\(p'_{0} = f'\left(0\right) = a_{1}\), and
\(p'_{1} = f'\left(1\right) = a_{1} + 2 a_{2} + 3 a_{3}\),
solve for \(a_{0}, a_{1}, a_{2}, a_{3}\),
\(a_{0} = p_{0}\), and
\(a_{1} = p'_{0}\), and
\(a_{2} = - 3 p_{0} - 2 p'_{0} + 3 p_{1} - p'_{1}\), and
\(a_{3} = 2 p_{0} + p'_{0} - 2 p_{1} - p'_{1}\),
write this back into \(f\left(u\right)\), (this is call Hermite Equations)
\(f\left(u\right) = p_{0} + p'_{0} u + \left(- 3 p_{0} - 2 p'_{0} + 3 p_{1} - p'_{1}\right) u^{2} + \left(2 p_{0} + p'_{0} - 2 p_{1} + p'_{1}\right) u^{3}\), or
\(f\left(u\right) = \left(1 - 3 u^{2} + 2 u^{3}\right) p_{0} + \left(u - 2 u^{2} + u^{3}\right) p'_{0} + \left(3 u^{2} - 2 u^{3}\right) p_{1} + \left(-u^{2} + u^{3}\right) p'_{1}\).
📗 Implicit form representation of curves are useful for checking whether a point is on (or insider) a curve, but not convenient for drawing curves too.
📗 A unit circle can be written in the form \(f\left(x, y\right) = 0\) as \(x^{2} + y^{2} - 1 = 0\).
📗 One parametric representation of the same circle is \(\begin{bmatrix} x \\ y \end{bmatrix} = \begin{bmatrix} \cos\left(2 \pi u\right) \\ \sin\left(2 \pi u\right) \end{bmatrix} , u \in \left[0, 1\right])\).
📗 The region inside a unit circle (disc) can be written as \(x^{2} + y^{2} - 1 < 0\).
📗 One parameteric representation of the same region is \(\begin{bmatrix} x \\ y \end{bmatrix} = \begin{bmatrix} r \cos\left(2 \pi u\right) \\ r \sin\left(2 \pi u\right) \end{bmatrix} , u \in \left[0, 1\right], r \in \left[0, 1\right]\).
📗 Note on curve splitting: if (A, B, C) are the original points, then (A, AB, ABC) and (ABC, BC, C) are the control points of first half and second half of the curve.
📗 Similarly, if (A, B, C, D) are the original points, then (A, AB, ABC, ABCD) and (ABCD, BCD, CD, D) are the first half and second half of the curve.
📗 Given the polynomial segment specified in Hermite form with \(p_{0} = \begin{bmatrix} 0 \\ 0 \end{bmatrix}\), \(p'_{0} = \begin{bmatrix} 1 \\ 0 \end{bmatrix}\), and \(p_{1} = \begin{bmatrix} 1 \\ 1 \end{bmatrix}\), try find the control points of the Bezier curve.
📗 Given the polynomial segment specified in Hermite form with \(p_{0} = \begin{bmatrix} 0 \\ 0 \end{bmatrix}\), \(p'_{0} = \begin{bmatrix} 1 \\ 0 \end{bmatrix}\), \(p_{1} = \begin{bmatrix} 1 \\ 1 \end{bmatrix}\) and \(p'_{1} = \begin{bmatrix} 1 \\ 0 \end{bmatrix}\), try find the control points of the Bezier curve.
➩ Its tangent (velocity) at the first control point is \(2 \cdot \left(\begin{bmatrix} x_{2} \\ y_{2} \end{bmatrix} - \begin{bmatrix} x_{1} \\ y_{1} \end{bmatrix} \right)\).
➩ Its tangent (velocity) at the last control point is \(2 \cdot \left(\begin{bmatrix} x_{2} \\ y_{2} \end{bmatrix} - \begin{bmatrix} x_{3} \\ y_{3} \end{bmatrix} \right)\).
📗 context.moveTo(x1, y1); context.bezierCurveTo(x2, y2, x3, y3, x4, y4); produces a degree 3 Bezier curve with four control points: Doc
➩ Its tangent (velocity) at the first control point is \(3 \cdot \left(\begin{bmatrix} x_{2} \\ y_{2} \end{bmatrix} - \begin{bmatrix} x_{1} \\ y_{1} \end{bmatrix} \right)\).
➩ Its tangent (velocity) at the last control point is \(3 \cdot \left(\begin{bmatrix} x_{3} \\ y_{3} \end{bmatrix} - \begin{bmatrix} x_{4} \\ y_{4} \end{bmatrix} \right)\).
📗 Notes and code adapted from the course taught by Professor Michael Gleicher.
📗 Please use Ctrl+F5 or Shift+F5 or Shift+Command+R or Incognito mode or Private Browsing to refresh the cached JavaScript: Code.
📗 You can expand all the examples and demos: , or print the notes: .
📗 If there is an issue with TopHat during the lectures, please submit your answers on paper (include your Wisc ID and answers) or this Google Form at the end of the lecture.