自繪Mandelbrot集合（五）

知識 05-06

十一、RGB顏色模型和真彩色

在繼續修改程序以前，我們先要討論一下和顏色相關的計算機語言知識。

在程序的第(9)部分給像素繪色時，其中表示顏色的參數是一個32比特的整數。這個顏色代碼使用的是通常所說的RGB顏色模型或紅綠藍顏色模型，並分別用8比特的數據來表示某顏色中的紅、綠、藍分量，即總共用24比特的數據來表示一種顏色，故可表示的不同顏色總共有224約為1677萬種，即通常所說的「真彩色」方式。因為每種顏色分量都用8比特數據來表示，所以都有從0到255這256種可能性。數字越小，相應分量越小，反之亦然。

在上述方式下，一個32比特整數如何表示一種色彩？最高位的8比特通常被忽略（也有用作Alpha通道的，即表示此像素的透明程度，但在這裡和我們無關）。接下去的8比特用來表示此顏色中的紅色分量，然後是8比特的綠色分量，最後是8比特的藍色分量。因為8比特數據恰好可以用兩個十六進位數來表示，所以每種顏色也可用6位十六進位數來表示。

所以當我們拿到一個32比特整數rgb，想知道它代表了紅綠藍顏色分量分別為多少的顏色，只需將其表示為32位二進位形式，忽略其最高8位，然後依次每8位表示的就是此顏色的紅綠藍色分量（或者將其表示為8位十六進位形式，忽略其最高2位，然後依次每2位表示的就是此顏色的紅綠藍色分量）。比如十六進位數ABCDEF表示的顏色中，紅色分量為AB（十進位數171），綠色分量為CD（十進位數205），藍色分量為EF（十進位數239）。如果用Java程序寫出來：

裡面計算所得的，，就是整數所代表的顏色的紅、綠、藍分量。（&為按位與運算，「& 0xFF」即十六進位數只取最低兩位。）

反之，如果我們知道了某顏色的紅綠藍分量（數字都在0和255之間），如何得到其顏色的整數表示？反過來即可，把分量寫成二進位（或十六進位）形式，分段拼好：

（|為按位或運算。）

十二、顏色漸變

顏色漸變也叫色彩梯度。給定兩種顏色，可以非常不同（比如紅色和綠色），如何實現從第一種顏色到第二種顏色的漸變，也就是在它們間插入一系列顏色，使得每兩種相鄰的顏色間的區別都不大？最簡單的方式大概就是分別對兩種顏色的紅綠藍分量進行線性插值，然後將得到的分量合成就得到了顏色（函數）。

比如說我們取一種顏色為紅色（十六進位數FF0000，紅色分量全滿，其它兩分量為0），另一種為綠色（十六進位數00FF00）。那麼下面的函數，當變數取0到1之間的實數時，我們就得到了從紅色漸變為綠色過程的一系列顏色：

代碼很容易懂：先是把紅色和綠色拆成各分量，然後再以變數為各分量作線性插值並四捨五入取整，算出所得顏色的各分量，最後返回拼合的顏色。下圖即用此函數計算所得的顏色，從左到右從0線性地變到1：

紅到綠的線性插值

十三、根據迭代次數選擇顏色的調色盤

回過頭來看我們繪製Mandelbrot集合的程序，我們改寫一下調色盤函數。

Java版本：

JavaScript版本：

我們得到

自繪Mandelbrot集合（五）

-0.743030 + 0.126433i @ 0.016110 /0.75

終於見到了海馬尾和孔雀羽眼的形狀，雖然還缺點顏色。

容易看出，上面新添的函數計算的正是給定兩顏色參數和的線性插值。而在新的調色盤函數中，我們不再作非黑即白的劃分，而是根據超過逃逸半徑所需的迭代次數（更精確地說，是根據「迭代次數/迭代次數上限」值，此值總是在0和1之間）來選擇顏色：次數越少，像素的顏色就越靠近白色（十六進位數FFFFFF）；次數越多，像素的顏色就越靠近深灰色（十六進位數202020）。

和開始的非白即黑圖相比，在新圖中多出來的那些像素全都不是黑色，而是某種程度的灰色，也即代表它們的中心點都不屬於Mandelbrot集合。所以在這裡要糾正的一個誤解，當我在前面說繪出的圖是「Mandelbrot集合的圖像」，這話並不精確。那些圖像更象是Mandelbrot集合的圖像再加上在Mandelbrot集合附近但並不屬於Mandelbrot集合的點的某種結構的圖像，而所謂的「某種結構」是通過對不同迭代次數的區別對待而顯現出來的。

但反過來說，之所以在複平面的某個地方，不屬於Mandelbrot集合的點會有複雜的結構，也是因為在那附近有屬於Mandelbrot集合的點。粗略地說，一個點雖然不屬於Mandelbrot集合，也就是在迭代過程中數列最終還是超出了逃逸半徑，但是用了比其他點更多的次數，那是因為它比其他點更靠近Mandelbrot集合。此時雖然我們在取代表點的過程中沒能直接取中屬於Mandelbrot集合的點，但通過觀測到離它很近的集合外的點，也算間接觀測到了集合本身的形狀。所以在這種意義下，我們說這個圖像就是「Mandelbrot集合的圖像」，也未嘗不可。

當然，我們完全可以用其他的調色盤函數來取代前面舉的例子。比如說換成（此處只提供Java版本，很容易改寫成JavaScript版本）

-0.743030 + 0.126433i @ 0.016110 /0.75

這是以超過逃逸半徑所需的迭代次數的除以3的餘數來決定顏色。如果嫌細節部分亂糟糟，還可以分段考慮，迭代次數100以內（也即離Mandelbrot集合較遠的那些點）考慮除以2的餘數，超過100則用前面的線性插值，做到兩種風格兼具：

-0.743030 + 0.126433i @ 0.016110 /0.75

或者試試sin函數？

自繪Mandelbrot集合（五）