Фракталы

CSS:

<style>
/* Общие параметры для отображаемой точки */
div.fract {position:absolute;width:1px;height:1px}
</style>

JavaScript-код:

function fractal(x0,y0,xk,yk,dx,kmax,lmax,a,b,mode){ // конструктор

/* Описание:
   Данный объект генерирует строку тегов для вывода на экран браузера
   фрактальной картинки,вычисленной по простой формуле.
   В прямоугольнике с координатами углов (x0,y0) и (xk,yk)
   тестируются все точки через интервал dx путем итерационного преобразования:
     z(i+1)=F(z(i)),
     где z - комплексное число вида x+yi;
         F() -функция преобразования комплексного числа в другое комплексное число.
   Если на какой-то итерации точка выйдет за круг радиуса lmax с центром
   в начальной точке или же количество итераций превысит kmax, исходная точка
   окрашивается в цвет, зависящий от номера итерации.
   Собственно формула преобразования задается кодом функции next(), а исследование судьбы точки
   при итерационном преобразовании — кодом функции explore().
   
   Параметры (свойства):
   x0,y0 - начальное число (вещественная и мнимая части комплексного числа)
   xk,yk - конечное число (вещественная и мнимая части комплексного числа)
   dx - приращение числа в итерации при вычислении функции F()
   kmax - максимальное количество итераций (ограничение)
   lmax - радиус круга с центром в начальной точке (при выхде из него итерации прекращаются)
   mode - задает формулу преобразования координат точек, т.е. функцию z(i+1)=F(z(i)):
   если не указан, то z(i+1)=a*z(i)*z(i)+b (a,b — некоторые комплексные числа);
   в противном случае z(i+1) определяется несколько иначе (см. функцию next()).
   В исходном варианте функция преобразования имеет вид z(i+1)=a*z(i)*z(i)+b.
   
   Метод get() возвращает строку тегов,описывающих фрактальную картинку;
   Свойство resume содержит строку отчета о работе; 
   
*/
/* Параметры: */
/* Примеры значений, которые вы можете изменить: */
this.x0=x0||-1.5;
this.y0=y0||-1.5;      
this.xk=xk||1.5;
this.yk=yk||1.5;
this.dx=dx||0.01;   // приращение чисел
this.kmax=kmax||100;// ограничение итераций
this.lmax=lmax||30; // радиус области
this.a=a;  // множитель a в формуле zi+1=a*F(zi)+b
this.b=b;  // слагаемое b в формуле zi+1=a*F(zi)+b
this.mode=mode||null;  // вид преобразования
this.resume="";
if (!a) this.a=new Array(1,0);
if (!b) this.b=new Array(0,0);

/* Метод, возвращающующий строку тегов для вывода: */
this.get=function() {  
  var time=new Date(); // хронометраж для отчета
  var t0=time.getTime();
var x,y,n;
var x0s=0;
var y0s=0;
var i=0;
var str="";
for (y=this.y0;y<this.yk;y=y+this.dx){
  x0s=0;
  for (x=this.x0;x<this.xk;x=x+this.dx){
    n=explore(x,y,this.kmax,this.lmax,this.a,this.b,this.mode);// судьба точки; возвращает номер итерации
    /*** Цвет точки: *******/
    if (n>this.kmax) n=this.kmax;
    var color="000000"+toh(16715266-n*(16581891/this.kmax));
    color="#"+color.substr(color.length-6);
    /* Код для отображения точки: */
    str+='<div class="fract" style="background:'+color+
      '; top:'+y0s+'px;left:'+x0s+'px"'+
      'title="'+x.toFixed(3)+','+y.toFixed(3)+'"></div>';
    x0s++;
    i++;
  }
  y0s++;
}

  var time=new Date(); // хронометраж для отчета
      t0=time.getTime()-t0;
/* Отчет: */
this.resume="Отчет\nТочек: "+i+"\nВремя: "+t0+"мс"+"\nБайт: "+str.length;

return str;
}

/*** Функции  ***********************************************/

function explore(x,y,kmax,lmax,a,b,mode){ /* исследует судьбу
                           точки; возвращает номер итерации */
var z,k,q,w;
z=new Array(x,y)
k=0;
while (true){
  z=next(z[0],z[1],a,b,mode);
  if (x==z[0]&&y==z[1]) return kmax; 
  k++;
  q=(x-z[0]);q=q*q;w=(y-z[1]);w=w*w;
  if ((q+w)>lmax*lmax)
    return k; // если вышли за пределы области 
  if (k>kmax) return kmax;// если количество итераций слишком велико 
}
}
/***************************************************/

function next(x,y,a,b, mode){  // возвращает координаты следующей точки
/* Возможны различные формулы вычисления */
if (mode){
  var x1=Math.sqrt(Math.abs(x*x-y*y));
  var y1=Math.sqrt(2*x*y);
}
if (!mode){ // Квадрат (по умолчанию)
  var x1=x*x-y*y;
  var y1=(2*x*y);
}
x=x1*a[0]-y1*a[1]+b[0];
y=y1*a[0]+x1*a[1]+b[1];
return new Array(x,y);
}
/***************************************************/
function toh(n){ // возвращает 16-е число, соответствующее 10-му числу n
n=Math.round(n);
var  hchars="0123456789abcdef"     /* строка, содержащая все
                                   шестнадцатеричные цифры */
  if (n<16) return hchars.charAt(n);
  var i=n%16;
  return toh((n-i)/16)+hchars.charAt(i) 
}
}
/*****************************************************************/

Пример вызова:

myfr=new fractal(); // создаем экз. объекта fractal
/* Устанавливаем значения свойств: */
myfr.x0=-1;
myfr.xk=1;
myfr.lmax=100;
myfr.kmax=30;
myfr.a=new Array(1,0.5); // параметр a
myfr.b=new Array(0.5,0.5);
/* Получаем строку HTML-кода и записываем в документ: */
document.write(myfr.get());
alert(myfr.resume) // выводим отчет