EmptyCrate.com: Javascript Mandelbrot Browser

I was inspired by my recent attempt at creating a parallel Mandelbrot generator for Minnow to learn some javascript and make a javascript version of it. Here is an actual example of this code in use. The javascript itself is pretty simple:

function point(t_x, t_y)
{
  this.x = t_x;
  this.y = t_y;
}
function color(t_r, t_g, t_b)
{
  this.r = t_r;
  this.g = t_g;
  this.b = t_b;   
}

function get_color(t_point, t_center, t_width, t_height, t_scale)
{
  var xscaled = t_point.x/(t_width/t_scale) + (t_center.x - (t_scale/2.0 ));
  var yscaled = t_point.y/(t_height/t_scale) + (t_center.y - (t_scale/2.0 ));

  var x = xscaled;
  var y = yscaled;

  var iteration = 0;
  var max_iteration = 2000;

  var stop_iteration = max_iteration;

  while ( iteration < stop_iteration )
  {
    if ((x*x) + (y*y) > (2.0*2.0) && stop_iteration == max_iteration)
    {
      stop_iteration = iteration + 5
    }
     
    var xtemp = (x*x) - (y*y) + xscaled;
    y = (2.0*x*y) + yscaled;
    x = xtemp;
    iteration += 1
  }

  if (iteration == max_iteration)
  {
    return new color(0.0,0.0,0.0)
  } else {
    var value = ((iteration + 1) - (Math.log(Math.log(Math.abs(x * y))))/Math.log(2.0)); 
    var red = 0.0;
    var green = 0.0;
    var blue = 0.0;

    var colorval = Math.floor(value * 10.0);

    if (colorval < 256)
    {
      red = colorval/256.0;
    } else {
      colorband = Math.floor((colorval - 256) % 1024 / 256);
      mod256 = colorval % 256;
      if (colorband == 0)
      {
        red = 1.0;
        green = mod256 / 255.0;
        blue = 0.0;
      } else if (colorband == 1) {
        red = 1.0;
        green = 1.0;
        blue = mod256 / 255.0;
      } else if (colorband == 2) {
        red = 1.0;
        green = 1.0;
        blue = 1.0 - (mod256/255.0);
      } else {
        red = 1.0;
        green = 1.0 - (mod256/255.0);
        blue = 0.0;
      }
    }
    return new color(red, green, blue);
  }
}

function region_calc(t_tl, t_br, t_width, t_height, t_center, t_scale, t_context)
{
  for (var y = t_tl.y; y < t_br.y; y++)
  {
    for (var x = t_tl.x; x < t_br.x; x++)
    {
      var p = new point(x,y);
      set_pixel(p, get_color(p, t_center, t_width, t_height, t_scale), t_context);
    }
  }
}

function set_pixel(t_point, t_color, t_context)
{
  t_context.fillStyle = "rgb("+Math.floor(t_color.r*255)+","+Math.floor(t_color.g*255)+","+Math.floor(t_color.b*255)+")";
  t_context.fillRect(t_point.x, t_point.y, 1, 1);
}

function draw() 
{
  var m_width = document.getElementById("width").value;
  var m_height = document.getElementById("height").value;
  var m_x = document.getElementById("xloc").value;
  var m_y = document.getElementById("yloc").value;
  var m_scale = document.getElementById("scale").value;

  var canvas = document.getElementById("canvas");
  canvas.width = m_width;
  canvas.height = m_height;
  var ctx = canvas.getContext("2d");
  region_calc(new point(0,0), new point(m_width, m_height), m_width, m_height, new point(m_x, m_y), m_scale, ctx);
}

EmptyCrate

About Me | Contact Me | Training | C++ Weekly (YouTube) | Awesome C++ T-Shirts

Javascript Mandelbrot Browser