贝塞尔曲线的方程是什么？

参数方程：B(t) = (1-t)^3P₀ + 3(1-t)^2t P₁ + 3(1-t)t^2P₂ + t^3P₃。P₀ = (0, 0)、P₃ = (1, 0) 是端点；P₁、P₂ 是用滑杆拖动的控制柄；t 从 0 走到 1。

贝塞尔曲线是怎么构造的？

构造规则：de Casteljau：把控制多边形每条边按比例 t 分开，再把新线段按 t 分开，再分一次，最后得到的点就是 B(t)。。P₀ = (0, 0)、P₃ = (1, 0) 是端点；P₁、P₂ 是用滑杆拖动的控制柄；t 从 0 走到 1。

参数曲线

贝塞尔曲线Bézier curve

字体、SVG 路径和 CSS 缓动背后的三次曲线：两个端点、两个控制柄，用反复的线性插值混合出来。

调节参数

P₁ 的 x0.15P₁ 的 y1P₂ 的 x0.85P₂ 的 y-0.6

导出

公式与关键数值

参数方程: $B(t) = (1-t)^3P_0 + 3(1-t)^2t\,P_1 + 3(1-t)t^2P_2 + t^3P_3$
端点处的切向: $B'(0) = 3(P_1 - P_0)$ $B'(1) = 3(P_3 - P_2)$
构造规则: de Casteljau：把控制多边形每条边按比例 t 分开，再把新线段按 t 分开，再分一次，最后得到的点就是 B(t)。

P₀ = (0, 0)、P₃ = (1, 0) 是端点；P₁、P₂ 是用滑杆拖动的控制柄；t 从 0 走到 1。

讲解视频

把贝塞尔曲线做成讲解视频

打开创作台，自动填好这条曲线的动画需求。自由生成目前是测试版。

开始制作

01 · 定义

什么是贝塞尔曲线？

雪铁龙的 Paul de Casteljau（1959）和雷诺的 Pierre Bézier（1960 年代）各自找到了用少数控制点描述光滑车身曲线的方法。三次的版本用四个点：从 P₀ 出发朝 P₁ 的方向走，到达 P₃ 时来自 P₂ 的方向，而且始终不越出这四点的凸包。

de Casteljau 算法只用反复的线性插值就得到点 B(t)：把控制多边形每条边按比例 t 分开，再把新线段按 t 分开，再做一次。同样的算术勾出 TrueType 和 OpenType 字体的字形（TrueType 用二次曲线，CFF 用三次），也画出 SVG 路径里的每段曲线和 CSS 里每个 cubic-bezier() 缓动。

02 · 性质

关键性质

经过 P₀ 和 P₃；一般不经过 P₁、P₂。
端点切向：B′(0) = 3(P₁ − P₀)，B′(1) = 3(P₃ − P₂)。
整条曲线位于四个控制点的凸包之内。
de Casteljau 算法用三轮线性插值求出曲线上的点。
权重 (1 − t)³、3(1 − t)²t、3(1 − t)t²、t³ 是伯恩斯坦多项式，和为 1。

03 · 问答

关于贝塞尔曲线的常见问题

贝塞尔曲线的方程是什么？: 参数方程：B(t) = (1-t)^{^3P₀} + 3(1-t)^{^2t} P₁ + 3(1-t)t^{^2P₂} + t^{^3P₃}。P₀ = (0, 0)、P₃ = (1, 0) 是端点；P₁、P₂ 是用滑杆拖动的控制柄；t 从 0 走到 1。
贝塞尔曲线是怎么构造的？: 构造规则：de Casteljau：把控制多边形每条边按比例 t 分开，再把新线段按 t 分开，再分一次，最后得到的点就是 B(t)。。P₀ = (0, 0)、P₃ = (1, 0) 是端点；P₁、P₂ 是用滑杆拖动的控制柄；t 从 0 走到 1。