如果你仔细留意的话,贝塞尔曲线其实无处不在,例如:
- 英文字体
- PS中的钢笔工具
- CSS动画
- SVG绘图
- Canvas绘图
既然用途如此广泛,那么贝塞尔曲线究竟是什么,怎样生成的呢?
贝塞尔曲线是图形学中一种重要的参数曲线(即由参数来控制曲线的形状),最开始是用来设计汽车形状的,后来慢慢沿用到其他领域。
贝塞尔曲线分为线性(Linear)、二次(Quadratic)、三次(Cubic)贝塞尔曲线,都有对应的数学公式,它们的特点如下:
- 线性:两个端点,没有控制点,一条直线。
- 二次:两个端点,一个控制点,一条曲线。
- 三次:两个端点,二个控制点,二条曲线。
我们这里讨论的主要是三次贝塞尔曲线。
三次贝塞尔曲线是这样的一条曲线,它依据四个位置任意的点坐标绘制出的一条光滑曲线,其中有两个端点和两个控制点。下图中的P0和P3为曲线起始端点,P1和P2为控制曲率和方向的控制点。