An Interactive Introduction to Splines

2D Spline Curves (HTML5 based)

• Bezier spline curves
  DeCasteljau algorithm. Linear, quadratic and cubic Bezier splines. Bezier spline subdivision. Bernstein polynomials. Recurrence relations. How to plot Bezier spline and basis functions. Proof of the deCasteljau algorithm.
• More Bezier splines Math
  Affine invariance. Convex hull. Linear precision. Differentiation of the Bezier curve. Deriving the deCasteljau algorithm.
• Interpolating Lagrange curve
  Interpolating curves. Lagrange polynomials. Knots. Aitken algorithm. Lagrange curve oscillations.
• Interpolating Cardinal and Catmull-Rom splines
  Continuity. Building a complex spline. Getting rid of tangents. Cardinal curve subdivision.
• B-splines
  • Building quadratic B-spline
    Quadratic Bezier spline subdivision. Building complex B-spline curves. de Boor points and Cox - de Boor algorithm.
  • B-spline basis functions
    Recurrence relations. Knot vectors. Uniform B-splines. Closed curves.
  • Nonuniform B-splines
    Bezier and B-splines. Handling endpoints.
  • Interpolating cubic B-splines
    Bezier control points. Solving banded equations. Handling the terminal tangents.
• NURBS
  Weighted control points. Perspective projection. Conic sections. Circular arcs.

  3D Spline Surfaces (WebGL based)

• Tensor product Bezier spline surfaces
  Cubic Bezier spline patches. Normals and colors. 3D spline based models.
• Cubic Bezier patch with adaptive subdivision

  Subdivision splines

• Subdivision spline curves
  The Lane-Riesenfeld algorithm. Closed and clamped curves. Creases. Limit point position and tangent vector.
• Loop subdivision spline surface
  Loop splines. Approximating splines in 3D modelers. 3D spline based models.
• Animated splines
  Keyframe animations. Little dolphin.

  Procedural noise

• Subdivision spline noise
  Tensor product subdivision spline patches. Random spline based terrains and textures. Mixed fractal and spline based terrains. Terrain editor. "Red planet".
• Fractal terrains
  Tiny mobile game demos. LOD algorithm. Simple animated clouds and water.
• Simplex noise
• Dynamic clouds and WebGL 2 dynamic clouds

  Examples

• Procedural garden (Adaptive LOD)
• Modeling the Mighty Maple for Web
• Animated Lathe flowers and Animated Lathe flowers 2
• THREEjs procedural flowers and animated flower   new
• WebXR garden. Interactive NURBS patch and Flowers + ThreeJS for Oculus Quest 2   in progress
• Gallery of procedural trees
• Gallery of procedural terrains
• WebGL Demos

Old 2001 version (with Java applets)

All sources are in public domain.