貝澤曲線


來自:http://blog.csdn.net/killwd/article/details/1460478

在圖形圖像編程時,我們常常需要根據一系列已知點座標來確定一條光滑曲線。其中有些曲線需要嚴格地通過所有的已知點,而有些曲線卻不一定需要。在後者中,比較有代表性的一類曲線是貝塞爾曲線(Bézier Splines)。


網友們可能注意到,貝塞爾曲線廣泛地應用於很多圖形圖像軟件中,例如Flash、Illstrator、CoralDRAW和Photoshop等等。什麼是貝塞爾曲線呢?你先來看看這個:


哼~一條很普通的曲線,好像真的無法給我們帶來什麼特殊感覺哦~那把這條曲線和繪製它所根據的點重疊地放在一起再瞧瞧吧:


Hoho,原來呀~貝塞爾曲線就是這樣的一條曲線,它是依據四個位置任意的點座標繪製出的一條光滑曲線。我們不妨把這四對已知點座標依次定義成(x0,y0)、(x1,y1)、(x2,y2)和(x3,y3)。貝塞爾曲線必定通過首尾兩個點,稱爲端點;中間兩個點雖然未必要通過,但卻起到牽制曲線形狀路徑的作用,稱作控制點。

在歷史上,研究貝塞爾曲線的人最初是按照已知曲線參數方程來確定四個點的思路設計出這種矢量曲線繪製法。涕淌爲了向大家介紹貝塞爾曲線的公式,也故意把問題的已知和所求顛倒了一下位置:如果已知一條曲線的參數方程,係數都已知,並且兩個方程裏都含有一個參數t,它的值介於0、1之間,表現形式如下所示:
x(t) = ax * t ^ 3 + bx * t ^ 2 + cx * t + x0
y(t) = ay * t ^ 3 + by * t ^ 2 + cy * t + y0
由於這條曲線的起點(x0,y0)是已知的,我們可以用以下的公式來求得剩餘三個點的座標:
x1 = x0 + cx / 3
x2 = x1 + ( cx + bx ) / 3
x3 = x0 + cx + bx + ax

y1 = y0 + cy / 3
y2 = y1 + ( cy + by ) / 3
y3 = y0 + cy + by + ay

你細細觀察一下就知道了,無論方程的已知和所求是什麼,總是有六個未知數,並且我們總能找到六個等式(記住(x0,y0)總是已知的),也就是說,上面的方法是完全可逆的,因此我們可以根據四個已知點座標來反求曲線參數公式的係數。稍微一變換就得到了下面這組公式:
cx = 3 * ( x1 - x0 )
bx = 3 * ( x2 - x1 ) - cx
ax = x3 - x0 - cx - bx

cy = 3 * ( y1 - y0 )
by = 3 * ( y2 - y1 ) - cy
ay = y3 - y0 - cy - by

所以說,對於座標任意的四個已知點,你總能創建一條貝塞爾曲線嘿嘿。在GDI+的2D圖形函數庫裏,已經封裝了貝塞爾曲線的繪製方法——就是Graphics類的DrawBezier()方法。DrawBezier()方法有很多個重載版本,很簡單,而且在MSDN裏有着詳細的介紹,涕淌在此就不浪費口水了(包括DrawBeziers()也是一樣)。不得不感嘆的是,強大的GDI+允許一個不瞭解貝塞爾曲線數學背景的人也能輕而易舉地繪製一條漂亮的貝塞爾曲線,對提高開發效率而言,這當然是件好事!

貝塞爾曲線的有趣之處更在於它的“皮筋效應”~也就是說,隨着點有規律地移動,曲線將產生皮筋伸引一樣的變換,帶來視覺上的衝擊。來,瞅瞅這張圖吧


Windows默認的屏保裏有一個“貝塞爾曲線”的程序,大家現在可以打開來欣賞一下。一組不斷扭伸的曲線令觀看的人感嘆它們的變幻莫測,其實箇中道理相當簡單,程序裏只是一羣分好了組的、按規律移動的點,機器根據點的移動、按照上面的公式實時地計算出當前的貝塞爾曲線,並在電腦屏幕上繪製出來,如此沒完沒了地進行着……

上個世紀七十年代,法國數學家Pierre Bézier第一個研究了這種矢量繪製曲線的方法,並給出了詳細的計算公式,因此按照這樣的公式繪製出來的曲線就用他的姓氏來命名~是爲貝塞爾曲線。


發佈了30 篇原創文章 · 獲贊 31 · 訪問量 35萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章