贝塞尔曲线（Bezier Curve）原理及公式推导

忘是亡心i 2023-07-11 05:50 92阅读 0赞

# 1. 定义 #

> **贝塞尔曲线(Bezier curve)**，又称**贝兹曲线**或**贝济埃曲线**，是应用于二维图形应用程序的数学曲线。一般的矢量图形软件通过它来精确画出曲线，贝兹曲线由**线段**与**节点**组成，节点是可拖动的支点，线段像可伸缩的皮筋，我们在绘图工具上看到的钢笔工具就是来做这种矢量曲线的。贝塞尔曲线是计算机图形学中相当重要的参数曲线，在一些比较成熟的位图软件中也有贝塞尔曲线工具，如PhotoShop等。

贝塞尔曲线的一些特性：

*  使用 n n n个控制点 \{ P 1 , P 2 , . . . , P n \} \\\{P\_1,P\_2,...,P\_n\\\} \{ P1,P2,...,Pn\}来控制曲线的形状
 *  曲线通过起始点 P 1 P\_1 P1和终止点 P n P\_n Pn，接近但不通过中间点 P 2 P\_2 P2~ P n − 1 P\_\{n-1\} Pn−1

# 2. 直观理解 #

**Step 1.** 在二维平面内选三个不同的点并依次用线段连接

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2NmYW45Mjc_size_16_color_FFFFFF_t_70_pic_center]

**Step 2.** 在线段 A B AB AB和 B C BC BC上找到 D D D、 E E E两点，使得 A D D B = B E E C \\frac\{AD\}\{DB\}=\\frac\{BE\}\{EC\} DBAD=ECBE

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2NmYW45Mjc_size_16_color_FFFFFF_t_70_pic_center 1]

**Step 3.** 连接 D E DE DE，并在 D E DE DE上找到 F F F点，使其满足 D F F E = A D D B = B E E C \\frac\{DF\}\{FE\}=\\frac\{AD\}\{DB\}=\\frac\{BE\}\{EC\} FEDF=DBAD=ECBE（抛物线的三切线定理）

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2NmYW45Mjc_size_16_color_FFFFFF_t_70_pic_center 2]  
**Step 4.** 找出符合上述条件的所有点

![在这里插入图片描述][20200304113229429.gif_pic_center]  
上述为一个二阶贝塞尔曲线。同样的有 n n n阶贝塞尔曲线：

# 3. 公式推导 #

## 3.1 一次贝塞尔曲线（线性公式） ##

> **定义**：给定点 P 0 P\_0 P0、 P 1 P\_1 P1，线性贝塞尔曲线只是一条两点之间的直线，这条线由下式给出，且其等同于线性插值：  
>  B ( t ) = P 0 + ( P 1 − P 0 ) t = ( 1 − t ) P 0 + t P 1 ,   t ∈ \[ 0 , 1 \] B(t)=P\_0+(P\_1-P\_0)t=(1-t)P\_0+tP\_1,\\text\{ \} t\\in\[0,1\] B(t)=P0\+(P1−P0)t=(1−t)P0\+tP1, t∈\[0,1\]

![在这里插入图片描述][20200304113656535.gif_pic_center]

其中，公式里的 P 0 P\_0 P0、 P 1 P\_1 P1同步表示为其 x x x或 y y y轴坐标。

假设 P 0 P\_0 P0坐标为 ( a , b ) (a,b) (a,b)， P 1 P\_1 P1坐标为 ( c , d ) (c,d) (c,d)， P 2 P\_2 P2坐标为 ( x , y ) (x,y) (x,y)，则有：

x − a c − x = t 1 − t ⇒ x = ( 1 − t ) a + t c (3-1) \\frac\{x-a\}\{c-x\}=\\frac\{t\}\{1-t\} \\Rightarrow x=(1-t)a+tc \\tag\{3-1\} c−xx−a=1−tt⇒x=(1−t)a\+tc(3\-1)

同理有：

y − b d − y = t 1 − t ⇒ y = ( 1 − t ) b + t d (3-2) \\frac\{y-b\}\{d-y\}=\\frac\{t\}\{1-t\} \\Rightarrow y=(1-t)b+td \\tag\{3-2\} d−yy−b=1−tt⇒y=(1−t)b\+td(3\-2)

于是可将 ( 3 − 1 ) ( 3 − 2 ) (3-1) (3-2) (3−1)(3−2)简写为：

B ( t ) = ( 1 − t ) P 0 + t P 1 ,   t ∈ \[ 0 , 1 \] (3-3) B(t)=(1-t)P\_0+tP\_1 ,\\text\{ \} t\\in\[0,1\] \\tag\{3-3\} B(t)=(1−t)P0\+tP1, t∈\[0,1\](3\-3)

## 3.2 二次贝塞尔曲线（二次方公式） ##

> **定义**：二次贝塞尔曲线的路径由给定点 P 0 P\_0 P0、 P 1 P\_1 P1、 P 2 P\_2 P2的函数 B ( t ) B(t) B(t)给出：  
>  B ( t ) = ( 1 − t ) 2 P 0 + 2 t ( 1 − t ) P 1 + t 2 P 2 ,   t ∈ \[ 0 , 1 \] B(t)=(1-t)^\{2\} P\_0+2t(1-t)P\_1+t^2P\_2,\\text\{ \} t\\in \[0,1\] B(t)=(1−t)2P0\+2t(1−t)P1\+t2P2, t∈\[0,1\]

![在这里插入图片描述][20200304113229429.gif_pic_center]

假设 P 0 P 1 P\_0P\_1 P0P1上的点为 A A A， P 1 P 2 P\_1P\_2 P1P2上的点为 B B B， A B AB AB上的点为 C C C（也即 C C C为曲线上的点。则根据一次贝塞尔曲线公式有：

A = ( 1 − t ) P 0 + t P 1 B = ( 1 − t ) P 1 + t P 2 C = ( 1 − t ) A + t B (3-4) \\begin\{array\}\{l\} A=(1-t)P\_0+tP\_1 \\\\ B=(1-t)P\_1+tP\_2 \\\\ C=(1-t)A+tB \\end\{array\} \\tag\{3-4\} A=(1−t)P0\+tP1B=(1−t)P1\+tP2C=(1−t)A\+tB(3\-4)

将上式中 A A A、 B B B带入 C C C中，即可得到二次贝塞尔曲线的公式：

B ( t ) = ( 1 − t ) 2 P 0 + 2 t ( 1 − t ) P 1 + t 2 P 2 ,   t ∈ \[ 0 , 1 \] (3-5) B(t)=(1-t)^\{2\} P\_0+2t(1-t)P\_1+t^2P\_2,\\text\{ \} t\\in \[0,1\] \\tag\{3-5\} B(t)=(1−t)2P0\+2t(1−t)P1\+t2P2, t∈\[0,1\](3\-5)

## 3.3 三次贝塞尔曲线（三次方公式） ##

同理可得三次贝塞尔曲线公式：

B ( t ) = ( 1 − t ) 3 P 0 + 3 t ( 1 − t ) 2 P 1 + 3 t 2 ( 1 − t ) P 2 + t 3 P 3 ,   t ∈ \[ 0 , 1 \] (3-6) B(t)=(1-t)^\{3\} P\_0+3t(1-t)^2P\_1+3t^2(1-t)P\_2+t^3P\_3,\\text\{ \} t\\in \[0,1\] \\tag\{3-6\} B(t)=(1−t)3P0\+3t(1−t)2P1\+3t2(1−t)P2\+t3P3, t∈\[0,1\](3\-6)

## 3.4  n n n次贝塞尔曲线（一般参数公式） ##

> **定义**：给定点 P 0 , P 1 , . . . , P n P\_0,P\_1,...,P\_n P0,P1,...,Pn，则 n n n次贝塞尔曲线由下式给出：  
> ![在这里插入图片描述][20200304125910775.png_pic_center]

n n n次贝塞尔曲线的公式可由如下递归表达：

P 0 n = ( 1 − t ) P 0 n − 1 + t P 1 n − 1 ,   t ∈ \[ 0 , 1 \] (3-7) P\_0^n=(1-t)P\_0^\{n-1\}+tP\_1^\{n-1\},\\text\{ \}t\\in\[0,1\] \\tag\{3-7\} P0n=(1−t)P0n−1\+tP1n−1, t∈\[0,1\](3\-7)

进一步可以得到贝塞尔曲线的递推计算公式：

P i k \{ P i ,   k = 0 ( 1 − t ) P i k − 1 + t P i + 1 k − 1 ,   k = 1 , 2 , . . . , n ;   i = 0 , 1 , . . . , n − k P\_i^k \\begin\{cases\} P\_i , \\text\{ \} k=0 \\\\ (1-t)P\_i^\{k-1\}+tP\_\{i+1\}^\{k-1\} , \\text\{ \} k=1,2,...,n; \\text\{ \} i=0,1,...,n-k \\end\{cases\} Pik\{ Pi, k=0(1−t)Pik−1\+tPi\+1k−1, k=1,2,...,n; i=0,1,...,n−k

这就是[德卡斯特里奥算法（De Casteljau’s algorithm）][De Casteljau_s algorithm]

# 参考 #

\[1\] [https://www.jianshu.com/p/0c9b4b681724][https_www.jianshu.com_p_0c9b4b681724]  
\[2\] [https://www.jianshu.com/p/8f82db9556d2][https_www.jianshu.com_p_8f82db9556d2]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2NmYW45Mjc_size_16_color_FFFFFF_t_70_pic_center]: https://img-blog.csdnimg.cn/20200304121524159.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2NmYW45Mjc=,size_16,color_FFFFFF,t_70#pic_center
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2NmYW45Mjc_size_16_color_FFFFFF_t_70_pic_center 1]: https://img-blog.csdnimg.cn/20200304121603117.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2NmYW45Mjc=,size_16,color_FFFFFF,t_70#pic_center
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2NmYW45Mjc_size_16_color_FFFFFF_t_70_pic_center 2]: https://img-blog.csdnimg.cn/20200304121643412.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2NmYW45Mjc=,size_16,color_FFFFFF,t_70#pic_center
[20200304113229429.gif_pic_center]: https://img-blog.csdnimg.cn/20200304113229429.gif#pic_center
[20200304113656535.gif_pic_center]: https://img-blog.csdnimg.cn/20200304113656535.gif#pic_center
[20200304125910775.png_pic_center]: https://img-blog.csdnimg.cn/20200304125910775.png#pic_center
[De Casteljau_s algorithm]: https://baike.baidu.com/item/%E5%BE%B7%E5%8D%A1%E6%96%AF%E7%89%B9%E9%87%8C%E5%A5%A5%E7%AE%97%E6%B3%95/22823239?fr=aladdin
[https_www.jianshu.com_p_0c9b4b681724]: https://www.jianshu.com/p/0c9b4b681724
[https_www.jianshu.com_p_8f82db9556d2]: https://www.jianshu.com/p/8f82db9556d2