贝塞尔曲线的理解

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)a + tc
  • 同理 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/

posted @ 2019-10-09 16:38  方帅  阅读(8822)  评论(3编辑  收藏  举报