HTML Canvas Tag

Mandelbrot Set

Mandelbrot Set implemented in javascript with the canvas element. See Wikipedia for more information.


Source:

	yi = 0;
	xi = 0;
	function animate(){
		var canvas = document.getElementById("can");
		var context = canvas.getContext("2d");
		context.fillStyle = "rgb(255,0,255)";
		var fac = 3.0 / 600.0;
		{
			for(var xi = 0; xi < 800; xi++){
				var Ci = (yi * fac - 1.5);
		        var Zr = 0.0;
		        var Zi = 0.0;
		        var Cr = (xi * fac - 2.5);
		        var i = 0;
		        var ZrN = 0;
		        var ZiN = 0;
		        do {
		          Zi = 2.0 * Zr * Zi + Ci;
		          Zr = ZrN - ZiN + Cr;
		          ZiN = Zi * Zi;
		          ZrN = Zr * Zr;
		        } while (!(ZiN + ZrN > 4.0) && ++i < 50);

				if(i == 50){
					context.fillStyle = "rgb(0,0,0)";
					context.fillRect (xi, yi, 1, 1);
				}
				else{
					context.fillStyle = "rgba(0,0,255," + (i/50)  + ")";
					context.fillRect (xi, yi, 1, 1);
				}
			}
		}
		yi++;
		if(yi < 600)
			setTimeout("animate();",1); 
	}
    

Home