The simple magic of the SVG-Spline is a single T command. Coupled with
SVG path-element convention of repeating last command, it turns a path into
C^{1}-smooth interpolating-spline.

Fonts use T intensively. The "@" glyph of "Times" uses T 29 times.

We'll revisit the SVG-Spline, but with a slightly different way of construction,
later in the article on our journey to create C^{2} continuos cubic spline.

Before we draw our guest of honor, we name some
creatures for clear and concise descriptions:

Points to be interpolated are referenced as members of JavaScript array P.

An open-spline interpolates all P-points but not P[last] to P[0]

A closed-spline (loop) interpolates all P-points including P[last] to P[0]

maintaining its smoothness at all points.

P-polygon is created by a closed linear-interpolation (straight-lines).

- A junction is a point with a neighbor point on each side.
On a closed-spline all points are junctions but on an open spline, P[0] and P[last] are not.

junction i is simply the junction P[i].

We sometimes refer to a junction as a join or a knot.

- P[i] segment (segment i) is the spline segment from P[i] to P[i+1]

Loosely speaking, we consider "left" of P[i] as the P[i-1] segment area,

and "right" of P[i] as the P[i] segment area.

- Junction P[i] triangle:

Its left leg (P[i].leftLeg) is the vector from P[i-1] to P[i] i.e. - (P[i] - P[i-1])

Its right leg (P[i].rightLeg) is the vector from P[i] to P[i+1] - (P[i+1] - P[i])

Its base (P[i].triBase) is the vector from P[i-1] to P[i+1] i.e. - (P[i+1] - P[i-1])

All edges of P[i] triangle are vectors thus we can slice them and add/subtract

the slices (also vectors) to/from points to create new points.

We reference P[i] triangle edges through P[i], for example, from the most basic vector addition definition
it follows that

The algorithm to interpolate an array of points P with Catmull-Rom spline
as piecewise cubic Bezier segments (for simplicity we assume a closed-spline
so all points are junctions and Catmull-Rom can interpolate 3 points in a loop):

For each junction P[i] do:

1) slice 1/6 of P[i].triBase, call it v

2) subtract v from P[i] to form P[i].L

3) add v to P[i] to form P[i].R

Spline is ready: