初識貝塞爾曲線

老早就聽說過大名鼎鼎的貝塞爾曲線------Bézier curve，今天就來一探究竟！

貝塞爾曲線是應用在二維圖形的數學曲線。貝塞爾曲線由線段與節點組成，節點是可拖動的支點，線段是可伸縮的橡皮筋，PS中的鋼筆工具能畫出來那麼漂亮的曲線，就是因爲數學家發明了貝塞爾曲線啊！(數學大佬賽高！)下圖就是PS畫出來的曲線。

曲線定義：起始點、終止點(也稱錨點)、控制點。通過調整控制點，貝塞爾曲線的形狀會發生變化。(如果沒理解的話，打開photoshop自己試試看鋼筆工具的作用你就明白啦)

比如在下圖中，起始點：P0；終止點：P3；控制點：P1和P2。拖動控制點就能按照自己的意願更改曲線的形狀。

來了解一下貝塞爾曲線的公式和圖形：B(t)爲t時間下點的座標；P0爲起點,Pn爲終點,Pi爲控制點

一階貝塞爾曲線------線段：

二階貝塞爾曲線-----拋物線：

三階貝塞爾曲線：

四階貝塞爾曲線：

五階貝塞爾曲線：

那麼貝塞爾曲線的推導公式又是如何呢？

我們以拋物線爲例：

拋物線的三切線定理：

當P0，P2固定，引入參數t，令上述比值爲t:(1-t)，(也就是那些動圖的公式的時間t)，即有：

簡化可得：

當t從0變到1時，它表示了由三頂點P0、P1、P2三點定義的一條二次Bezier曲線。

依次類推，

由四個控制點定義的三次Bezier曲線P03可被定義爲分別由(P0,P1,P2)和(P1,P2,P3)確定的二條二次Bezier曲線的線性組合，由(n+1)個控制點Pi(i=0,1,...,n)定義的n次Bezier曲線P0n可被定義爲分別由前、後n個控制點定義的兩條(n-1)次Bezier曲線P0n-1與P1n-1的線性組合：

由此得到Bezier曲線的遞推計算公式：

引申：

下面引申講一下CR-Spline。Catmull-Rom樣條線，是一根比較特殊的Bezier曲線，這條Bezier曲線能夠保證它會穿過從控制點的第二個點到控制點的倒數第二點之間的所有點。所以說，Catmull-Rom樣條線最少需要4個控制點來進行控制。

(我們已知了一些路徑點，我們希望我們的角色能夠平滑的沿着這些路徑點進行移動，而不是“直直的”從一個點走到另外一個點上去。一般情況下這時候會用到Catmull-Rom Spline，Catmull-Rom樣條線的數學背景十分的複雜，所以非搞數學的我們就不管這些了。我們只管如何用好吧！)

如上圖所示，這裏的P0，P1，P2，P3都是曲線上的點，公式(在下面)中的t取值範圍爲[0,1]，當t從0到1線性變化的時候，曲線就會從點P1（此時t=0），慢慢移動到P2（此時t=1）。這個曲線另外一個特點就是，我們計算出來的點P的切向量和這個點的周圍兩個起點和終點的切向量是平行的

//如何計算某兩個指定點之間的點----插值畫線
Output_point = P0 * (-0.5*t*t*t + t*t – 0.5*t) +

		P1 * (1.5*t*t*t + 2.5*t*t + 1.0) +

		P2 * (-1.5*t*t*t + 2.0*t*t + 0.5*t) +

		P3 * (0.5*t*t*t – 0.5*t*t);

如果你想要處理更多的點，那麼只有用前面的點，當前的點和接下來的兩個點來構造這條曲線就可以了。舉例來說，如果你現在有5個點，分別爲P1，P2，P3，P4，P5，那麼我們就可以構造兩條不同的曲線，他們的控制點分別爲[P1，P2，P3，P4]和[P2，P3，P4，P5]。當我們使用這兩條曲線去分別從t=[0,1]上去繪製，將得到P2-P3，P3-P4這兩條曲線。

如下CR-Spline曲線，是一位大佬自己寫的引擎一部分好像。。。