JS 绘制 Cardinal 样条曲线

Cardinal 曲线

根据定义，给定点集 ${P_{k - 1}, P_{k}, P_{k + 1}, P_{k + 2}}$ , 则 $P_{k}$ 到 $P_{k + 1}$ 之间的 Cardinal 曲线可以由如下方程生成：

\begin{aligned} P (u) & = a u^{3} + b u^{2} + c u + d \\ d & = P_{k} \\ c & = s (P_{k + 1} - P_{k - 1}) \\ b & = 3 (P_{k + 1} - P_{k}) - s (P_{k + 2} - P_{k}) - 2 c \\ a & = (P_{k + 1} - P_{k}) - c - b \end{aligned}

其中， $s$ 用于控制曲线的松紧，取值范围为 [0, 1]。 0 表示最紧绷 (无平滑转角)；1 表示最松弛。

根据公式，则只需将 $u$ 从 0 到 1 采样并依据公式计算坐标即可。不过，由于不好把握 $u$ 的采样间隔，这里并不打算采用这种方案。

我的思路是：

设有一个三次样条曲线，其表达式如下：

P (u) = a u^{3} + b u^{2} + c u + d

如果将 $u$ 的取值范围细分为具有固定大小 $h$ 的子区间，则相邻两点 $x$ 坐标为：

\begin{aligned} x_{k} & = x (u_{k}) \\ x_{k + 1} & = x (u_{k} + h) \end{aligned}

可计算出前向差分为：

\begin{aligned} Δ_{1} x_{k} & = x_{k + 1} - x_{k} \\ = 3 a h u_{k}^{2} + (3 a h^{2} + 2 b h) u_{k} + (a h^{3} + b h^{2} + c h) \end{aligned}

由于 $Δ_{1} x_{k}$ 是关于 $u$ 的多项式，计算复杂，所以也可以计算出 $Δ_{1} x_{k}$ 的增量 $Δ_{2} x_{k}$ ，这样即可用加法计算出 $Δ_{1} x_{k}$ 的值。不断重复计算增量的过程，直到增量为常数。最终可以得到：

\begin{aligned} Δ_{1} x_{k} & = 3 a h u_{k}^{2} + (3 a h^{2} + 2 b h) u_{k} + (a h^{3} + b h^{2} + c h) \\ Δ_{2} x_{k} & = 6 a h^{2} u_{k} + 6 a h^{3} + 2 b h^{2} \\ Δ_{3} x_{k} & = 6 a h^{3} \end{aligned}

根据以上公式，从 $u_{0} = 0$ 开始，步长为 $h$ ， $x$ 坐标的迭代过程为：

$k$	$Δ_{3} x_{k}$	$Δ_{2} x_{k}$	$Δ_{1} x_{k}$	$x_{k}$
0	$6 a h^{3}$	$6 a h^{3} + 2 b h^{2}$	$a h^{3} + b h^{2} + c h$	$d$
1	$6 a h^{3}$	$Δ_{2} x_{0} + Δ_{3} x_{0}$	$Δ_{1} x_{0} + Δ_{2} x_{0}$	$x_{0} + Δ_{1} x_{0}$
$⋮$
$k$	$6 a h^{3}$	$Δ_{2} x_{k - 1} + Δ_{3} x_{k - 1}$	$Δ_{1} x_{k - 1} + Δ_{2} x_{k - 1}$	$x_{k - 1} + Δ x_{k - 1}$
可以看到，每次迭代只需计算 3 次加法。