貝塞爾曲線的理解

Bezier曲線的由來

1962年，法國工程師貝塞爾發表，他運用貝塞爾曲線來為汽車的主體進行設計

Bezier曲線的作用

Bezier曲線是用一系列點控制曲線狀態的。主要分為

• 數據點：確定曲線的起始和結束位置
• 控制點：確定曲線的彎曲程度

舉例理解：想在AC（起始點和結束點）之間畫一個曲線，用B點（控制點）控制這個曲線的彎曲程度

但是控制點是可以多個的，比如兩個控制點。以此類推，可以有很多個。

起點和終點都只有一個，但是控制點可以多個，甚至是0，0的時候就是直線啦！

Bezier曲線的原理

為什么幾個點就可以得到一個曲線？
先說一個控制點的情況，如圖所示：

1. A/B/C三點是確定的
2. 在AB上任取一點D，得到ratio = AD/AB
3. 再由BE/BC = ratio 得到E點
4. 連接DE，同理DF/DE = ratio得到F
5. 而F點就是曲線上的一點，當然憑着這一點是無法得到整條曲線的
6. 於是，再來一遍，重新取D點得到新的F點，以此類推，如圖

那么兩個控制點呢？
道理是一樣的，在AB上任取一點E，得到曲線上的J點。
AE/AB = BF/BC = CG/CD = EH/EF = FI/FG = HJ/HI

最后來個炫酷的四個控制點：

理解Bezier曲線的公式

一次貝塞爾曲線

一次貝塞爾曲線（也是線性貝塞爾曲線）公式：B(t) = (1 - t) * P0 + tP1

• t表示在 P0P1/P0P1之間任取一點P2，t = P0P2/P0P1，也就是比例，公式里的P0和P1同步表示其x軸坐標或者y軸坐標。
• 已知P0的坐標是（a,b），P1的坐標是（c,d），那么假設P2的坐標是（x,y）
• (1-t)/(c-x) = t/(x-a) => x = (1-t)c + ta
• 同理 y = (1-t)d + tb
• 於是簡寫成 B(t) = (1 - t) * P0 + tP1

二次貝塞爾曲線

二次貝塞爾曲線（也是線性貝塞爾曲線）公式：

• t同上
• 在P0P1上的點是A，在P1P2上的點是B，在AB上的點是C，C也就是曲線上的一點。
• A ： tP1 + (1-t)P0
• B ： tP2 + (1-t)P1
• C ： tB + (1-t)A 將A、B換成上式，進行合並同類項

最后得到

同理可得三次貝塞爾曲線：

 原文：https://frontzhm.github.io/2017/07/07/bezier/