ベジェ曲線
ベジェ曲線(ベジェきょくせん、Bézier Curve)またはベジエ曲線とは、N 個の制御点から得られる N - 1 次曲線である。フランスの自動車メーカー、シトロエン社のド・カステリョ (Paul de Casteljau) とルノー社のピエール・ベジェ (Pierre Bézier) により別々に考案された。ド・カステリョの方が先んじていたが、その論文が公知とならなかったためベジェの名が冠されている[1]。コンピューター上で滑らかな曲線を描くのに2次ベジェ曲線 (Quadratic Bézier curve) や 3次ベジェ曲線 (Cubic Bézier curve) などが広く利用されている。
原語(フランス語)における Bézier の発音はベズィエに近く、「ベジェ曲線」より「ベジエ曲線」の方がこれに忠実と言えるが、いずれの呼称も用いられている。
応用
コンピュータ上で滑らかな曲線を書く場合にベジェ曲線を利用することが多い。ベクターグラフィクス、とりわけ文字の描画によく使われる。(参照:Type1フォント)
特に、3次ベジェ曲線 (Cubic Bézier curve) が多く用いられている。これは、始点と第1制御点を結ぶ線分が始点における曲線の接線になり、第2制御点と終点を結ぶ線分が終点における曲線の接線になるため、直感的に理解しやすいことにある。また、始点と第1制御点の距離によって始点付近の曲率が制御できるため、作図を行うソフトウェア(ドローソフト)で手作業により曲線を描く際に線の形を整えやすい。
3次と並んで、2次ベジェ曲線 (Quadratic Bézier curve) もよく使われる。こちらの制御点は1つ。角丸長方形の描画などに使える。Adobe Flash Player 10.3 までは2次のみをサポートしている。HTML5 の canvas要素 や Scalable Vector Graphics や Adobe Flash Player 11.0 などは3次もサポート。
定義
制御点を B0, B1, ..., BN-1 とすると、ベジェ曲線は
- <math>\mathbf{P}(t) = \sum_{i=0}^{N-1} \mathbf{B}_i J_{(N-1)i}(t)</math>
と表現される。ここで、Jni(t) はバーンスタイン基底関数のブレンディング関数である。
- <math>J_{ni}(t) = {n \choose i} t^i (1-t)^{n-i}</math>
t が 0 から 1 まで変化する時、B0 と BN-1 を両端とするベジェ曲線が得られる。一般には両端以外の制御点は通らない。ベジェ曲面においては各制御点のX座標とY座標の値が一定となり、Z座標の値で制御点を扱う。
作図法
3次のベジェ曲線(4個の制御点で示される曲線)の描画を説明をする。
右図の P0, P1, P2, P3 が与えられた制御点である。今、ベジェ曲線の P0 から t (0 < t < 1) の比率の位置の点の座標を求めるためには、次のように計算すればよい。
- まず、制御点を順に結んで得られる3つの線分 P0 - P1, P1 - P2, P2 - P3(緑色の線)をそれぞれ t : 1 - t の比率で分割する点、P4, P5, P6 を求める。
- 次に、これらの点を順に結んで得られる2つの線分 P4 - P5, P5 - P6(赤色の線)を再びそれぞれ t : 1 - t の比率で分割する点 P7, P8 を求める。
- 最後に、この2点を結ぶ線分 P7 - P8(黄色の線)をさらに t : 1 - t の比率で分割する点 P9 を求めると、この点がベジェ曲線上の点となる。
- この作業を 0 < t < 1 の範囲で繰り返し行う事により、P0, P1, P2, P3 を制御点とする3次ベジェ曲線(青い曲線)が得られる。
外部リンクも参照のこと。
脚注
関連項目
外部リンク
- 中学生でもわかるベジェ曲線 - Rui's Blog - 作図法をアニメーションで概説している。
- Bezier Surface - C言語とOpenGLによるベジェ曲面(線)の描画方法(英語版)テンプレート:Link GA