Bezier曲线扫盲

原文地址

相信很多同学都知道“贝塞尔曲线”这个词，我们在很多地方都能经常看到。但是，可能并不是每位同学都清楚地知道，到底什么是“贝塞尔曲线”，又是什么特点让它有这么高的知名度。

贝塞尔曲线的数学基础是早在 1912 年就广为人知的伯恩斯坦多项式。但直到 1959 年，当时就职于雪铁龙的法国数学家 Paul de Casteljau 才开始对它进行图形化应用的尝试，并提出了一种数值稳定的 de Casteljau 算法。然而贝塞尔曲线的得名，却是由于 1962 年另一位就职于雷诺的法国工程师 Pierre Bézier 的广泛宣传。他使用这种只需要很少的控制点就能够生成复杂平滑曲线的方法，来辅助汽车车体的工业设计。

正是因为控制简便却具有极强的描述能力，贝塞尔曲线在工业设计领域迅速得到了广泛的应用。不仅如此，在计算机图形学领域，尤其是矢量图形学，贝塞尔曲线也占有重要的地位。今天我们最常见的一些矢量绘图软件，如 Flash、Illustrator、CorelDraw 等，无一例外都提供了绘制贝塞尔曲线的功能。甚至像 Photoshop 这样的位图编辑软件，也把贝塞尔曲线作为仅有的矢量绘制工具（钢笔工具）包含其中。

贝塞尔曲线在 web 开发领域同样占有一席之地。CSS3 新增了 transition-timing-function 属性，它的取值就可以设置为一个三次贝塞尔曲线方程。在此之前，也有不少 JavaScript 动画库使用贝塞尔曲线来实现美观逼真的缓动效果。

下面我们就通过例子来了解一下如何用 de Casteljau 算法绘制一条贝塞尔曲线。

在平面内任选 3 个不共线的点，依次用线段连接。

在第一条线段上任选一个点 D。计算该点到线段起点的距离 AD，与该线段总长 AB 的比例。

根据上一步得到的比例，从第二条线段上找出对应的点 E，使得 AD:AB= BE:BC。

连接这两点 DE。

从新的线段 DE 上再次找出相同比例的点 F，使得 DF:DE= AD:AB= BE:BC。

到这里，我们就确定了贝塞尔曲线上的一个点 F。接下来，请稍微回想一下中学所学的极限知识，让选取的点 D 在第一条线段上从起点 A 移动到终点 B，找出所有的贝塞尔曲线上的点 F。所有的点找出来之后，我们也得到了这条贝塞尔曲线。

如果你实在想象不出这个过程，没关系，看动画！

回过头来看这条贝塞尔曲线，为了确定曲线上的一个点，需要进行两轮取点的操作，因此我们称得到的贝塞尔曲线为二次曲线（这样记忆很直观，但曲线的次数其实是由前面提到的伯恩斯坦多项式决定的）。

当控制点个数为 4 时，情况是怎样的？

步骤都是相同的，只不过我们每确定一个贝塞尔曲线上的点，要进行三轮取点操作。如图，AE:AB= BF:BC= CG:CD= EH:EF= FI:FG= HJ:HI，其中点 J 就是最终得到的贝塞尔曲线上的一个点。

这样我们得到的是一条三次贝塞尔曲线。

看过了二次和三次曲线，更高次的贝塞尔曲线大家应该也知道要怎么画了吧。那么比二次曲线更简单的一次（线性）贝塞尔曲线存在吗？长什么样？根据前面的介绍，只要稍作思考，想必你也能猜出来了。哈！就是一条直线~

能画曲线也能画直线，是不是很厉害？要绘制更复杂的曲线，控制点的增加也仅仅是线性的。这一特点使其不光在工业设计领域大展拳脚，就连数学基础不好的人也可以比较容易地掌握，比如大多数平面美术设计师们。

上面介绍的内容并不足以展示贝塞尔曲线的真正威力。推广到三维空间的贝塞尔曲面，以及更进一步的非均匀有理 B 样条（NURBS），早已成为当今计算机辅助设计（CAD）的行业标准，不论是我们平常用到的各种产品，还是在电影院看到的精彩大片，都少不了它们的功劳。

动态绘制贝塞尔曲线的在线演示

Bezier曲线扫盲相关推荐

android曲线位移动画,Bezier曲线在Android动画中的应用
Android动画的开发中,为了达到更加酷炫的效果,常常需要自定义运动轨迹,或者绘制花式复杂的曲线,这正是Bezier曲线大显神通的地方,本文将带你了解Bezier曲线在Android开发中的一些应用 ...
曲线数学NURBS之bezier曲线
最近新研究topic是NURBS,NURBS(Non Uniform Rational B-spline)即非均匀有理B样条曲线.往往提到B样条.以及NURBS就会提到bezier曲线,他们之间的关系 ...
bezier曲线_Bezier算法
个人博客: vectormoon's blogwww.vectormoon.net bezier算法的背景 vm公司设计出了一个原型车--moon,这样的: 产品经理一看觉得有点抽象,他使用了Bez ...
[摘抄] Bezier曲线、B样条和NURBS
Bezier曲线.B样条和NURBS,NURBS是Non-Uniform Rational B-Splines的缩写,都是根据控制点来生成曲线的,那么他们有什么区别了?简单来说,就是: Bezier曲 ...
Hermite曲线与Bezier曲线的关系
结论最近在研究3次样条曲线.曲线由四个控制点控制,依次记为P0,P1,P2,P3.在绘制Hermite曲线的时候,发现如果令P0处的导数为3倍P1-P0,P3处的导数为3倍P3-P2,则P0,P1, ...
计算机图形学E10——Bezier曲线
其他计算机图形学实验见链接 #include<gl/glut.h> #include<iostream> #include<algorithm> #include ...
贝塞尔Bezier曲线的使用
1 简介贝塞尔曲线就是这样的一条曲线,它是依据N个位置任意的点坐标绘制出的一条光滑曲线.那么,我们可以直观地认为,为了得到一条贝塞尔曲线,我们只要输入起点.终点及控制点既可.变化参数t都是位于[ ...
三次bezier曲线 MATLAB,Matlab-画二次及三次Bezier曲线-8控制点的B样条曲线
<Matlab-画二次及三次Bezier曲线-8控制点的B样条曲线>由会员分享,可在线阅读,更多相关<Matlab-画二次及三次Bezier曲线-8控制点的B样条曲线(3页珍藏版)& ...
Bezier曲线生成【计算机图形学】
原理: Bezier曲线是通过一组多边形折线的顶点来定义的.如果折线的顶点固定不变,则由其定义的Bezier曲线是唯一的.在折线的各顶点中,只有第一点和最后一点在曲线上且作为曲线的起始处和终止处,其他 ...

Bezier曲线扫盲

Bezier曲线扫盲相关推荐

最新文章

热门文章