from： http://blog.csdn.net/jia20003/article/details/7198612

無意之中在網上看到一篇基于HTML5 Demo的Peter De Jong　吸引子生成圖像的Demo，沒Hold住，

感覺太漂亮了。于是想研究一下，發現有個專業術語 - 分形。一位大師這樣評價分形學科 - “it is not about?

math, it is about art”?顯然有時候程序員也是有點藝術細胞。

效果圖一

效果圖二

效果圖三：

產生原理

基于Peter De Jong公式：Peter De Jong的數學公式如下：

Xn+1 = sin(a*yn) - cos(b*xn)

Yn+1 = sin(c*xn) - cos(d*yn)

從一個隨機的點P(x0, y0)開始得到下一個P（xn,yn）然后令 Xn = Xn+1, Yn = Yn+1

迭代產生更多數據。

?

算法實現

算法實現基于分形火焰算法，首先根據迭代的出來的數據點，使用直方圖統計算法得到指定大小直方圖數據點,

然后再根據直方圖的結果實現像素繪制和顏色，透明度生產。關于分形火焰算法可以參考這里 ：

?http://en.wikipedia.org/wiki/Fractal_flame

?完成隨機點產生與直方圖統計代碼：

[java] view plaincopy

<span?style="font-weight:?normal;">private?void?getPoint()?{??

??

????????la?=?a;??

????????lb?=?b;??

????????lc?=?c;??

????????ld?=?d;???

??????????

????????//?Add?Noise?to?Coefficients?for?Smoothness??

????????if?(noise)?{??

????????????la?+=?getRandom();??

????????????lb?+=?getRandom();??

????????????lc?+=?getRandom();??

????????????ld?+=?getRandom();??

????????}??

??????????

????????//?*************************************************??

????????//?**?Update?Temp?Variables?--?Magic??

????????xn?=?(float)(Math.sin(la?*?y)?-?Math.cos(lb?*?x));???

????????yn?=?(float)(Math.sin(lc?*?x)?-?Math.cos(ld?*?y));???

??????????

????????//?color?here??

????????zn?=?(float)(Math.sin(e?*?x)?-?Math.cos(f?*?z));???

??????????

????????//?take?current?result?as?x0,y0,z0?in?order?to?calculate?next?xn,yn,zn??

????????x?=?xn;??

????????y?=?yn;??

????????z?=?zn;??

??????????

????????//?Convert?to?2D?Image?Space?for?Plotting??

????????u?=?(int)?((x?+?2.5)?*?K);???

????????v?=?(int)?((y?+?2.5)?*?K);??

??

????????tr?=?(float)(z?*?0.9?+?(1.0?-?z)?*?0.6);?//?Map?Z-Coordinate?to?Color??

????????tg?=?(float)(z?*?0.2?+?(1.0?-?z)?*?0.4);??

????????tb?=?(float)(z?*?0.5?+?(1.0?-?z)?*?0.9);??

??????????

????????pList[u][v][0]?+=?1.0f;?//?alpha?value,?normalization?factor,?must?have?it??

????????pList[u][v][1]?+=?tr;?//Add?New?Point?to?Total??

????????pList[u][v][2]?+=?tg;????

????????pList[u][v][3]?+=?tb;??

????}??

</span>??

結果歸一化與像素繪制代碼：

[java] view plaincopy

<span?style="font-family:Arial,?Verdana,?sans-serif;"><span?style="white-space:?normal;"><span?style="font-family:monospace;"><span?style="white-space:?pre;"></span></span></span></span><pre?name="code"?class="java"><span?style="font-weight:?normal;">?private?void?renderPoints(int[]?rgbData)?{??

????????float?max?=?-1.0f;??

????????for?(int?i=0;?i?<?nSize;?i++)?{??

??????????for?(int?j=0;?j?<?nSize;?j++)?{??

??????????????if?(pList[i][j][3]?>?max){??

????????????????max?=?pList[i][j][3];??

????????????????}??

??????????????}??

??????????}??

??

????????//Adjust?Values?and?Fill?Image??

????????float?logval,?logmax?=?(float)Math.log(max);??

????????float?M?=?(float)((logmax?*?logmax)?/?255.0f);??

????????int[]?color?={0,0,0,0};??

????????for?(int?i=0;?i?<?nSize;?i++)?{??

????????????for?(int?j=0;?j?<?nSize;?j++)?{??

??????????????for?(int?k=0;?k?<?4;?k++)?{??

????????????????logval?=?(float)Math.log(pList[i][j][k]);??

????????????????color[k]?=?(int)?(logval?*?logval?/?M);??

??????????????}??

??????????????//?rgbData[j*nSize?+?i]?=?(color[0]?<<?24)?|?(color[1]?<<?16)?|?(color[2]?<<?8)?|?color[3];??

??????????????rgbData[j*nSize?+?i]?=?(255?<<?24)?|?(color[1]?<<?16)?|?(color[2]?<<?8)?|?color[3];??

??????????}??

????????}??

????}</span></pre>??

<pre></pre>??

<p></p>??

<pre></pre>??

<br>??

<p></p>??

<p>隨機產生參數?a,?b,c,d,e,f值區間在[-3,3]之間，可以得到你認為很cool的效果。</p>??

<p>算是送給大家的2012新年禮物吧，程序完全是基于Java語言實現。</p>??

<br>??

<pre></pre>??

??????

????????<div?style="padding-top:20px">???????????

????????????<p?style="font-size:12px;">版權聲明：本文為博主原創文章，未經博主允許不得轉載。</p>??

????????</div>?

總結

以上是生活随笔為你收集整理的超纯超美的曲线（Peter De Jong Attractor）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。