Javascript Julia set generation

gistfile1.js

<canvas id = "cvs"></canvas>

<script>
/**
 * HSV to RGB color conversion
 *
 * H runs from 0 to 360 degrees
 * S and V run from 0 to 100
 * 
 * Ported from the excellent java algorithm by Eugene Vishnevsky at:
 * http://www.cs.rit.edu/~ncs/color/t_convert.html
 */
function hsvToRgb(h, s, v) {
	var r, g, b;
	var i;
	var f, p, q, t;
	
	// Make sure our arguments stay in-range
	h = Math.max(0, Math.min(360, h));
	s = Math.max(0, Math.min(100, s));
	v = Math.max(0, Math.min(100, v));
	
	// We accept saturation and value arguments from 0 to 100 because that's
	// how Photoshop represents those values. Internally, however, the
	// saturation and value are calculated from a range of 0 to 1. We make
	// That conversion here.
	s /= 100;
	v /= 100;
	
	if(s == 0) {
		// Achromatic (grey)
		r = g = b = v;
		return [Math.round(r * 255), Math.round(g * 255), Math.round(b * 255)];
	}
	
	h /= 60; // sector 0 to 5
	i = Math.floor(h);
	f = h - i; // factorial part of h
	p = v * (1 - s);
	q = v * (1 - s * f);
	t = v * (1 - s * (1 - f));

	switch(i) {
		case 0:
			r = v;
			g = t;
			b = p;
			break;
			
		case 1:
			r = q;
			g = v;
			b = p;
			break;
			
		case 2:
			r = p;
			g = v;
			b = t;
			break;
			
		case 3:
			r = p;
			g = q;
			b = v;
			break;
			
		case 4:
			r = t;
			g = p;
			b = v;
			break;
			
		default: // case 5:
			r = v;
			g = p;
			b = q;
	}
	
	return [Math.round(r * 255), Math.round(g * 255), Math.round(b * 255)];
}
var cvs = document.getElementById("cvs");
cvs.height = cvs.width = 400;

function iterate(x, y, cr, ci){
  var x0 = x, y0 = y;
  // z^2 + c
  var rad = 4;
  var it = 1000;
  var xtemp;
  var i;
  for (i = 1; i < it; i++){
    xtemp = x0 * x0 - y0 * y0 + cr;
    y0 = 2 * x0 * y0 + ci;
    x0 = xtemp;

    if (x0 * x0 + y0 * y0 >= rad){
      break;
    }
  }
  return i / it;
}

var context = cvs.getContext('2d');
data = context.getImageData(0, 0, cvs.width, cvs.height);
pixels = data.data;

var cr = 0.285, ci = 0.01;

for (var x = 0; x < cvs.width; x++){
  for (var y = 0; y < cvs.height; y++){
    var cx = (x - cvs.width / 2) * 2 / cvs.width;
    var cy = (y - cvs.height / 2) * 2 / cvs.height;

    var value = Math.sqrt(iterate(cx, cy, cr, ci));
    var pixel = hsvToRgb(Math.round(360 * value), 50, 50);

    for (var i = 0; i < 3; i++){
      pixels[(y * cvs.width + x) * 4 + i] = pixel[i];
    }
    pixels[(y * cvs.width + x) * 4 + 3] = 255;
  }
}
data.data = pixels;
context.putImageData(data, 0, 0);
</script>