DEV Community

Cover image for How to Create Complexity from Simple Rules
Hunar Ahmad
Hunar Ahmad

Posted on

How to Create Complexity from Simple Rules

The following is a very simple bared-down code necessary to produce Mandelbrot in your browser

  <canvas id="gardun" width="1000" height="1000"></canvas>
  <script>
  m = document.getElementById("gardun").getContext("2d")
  atom = function(x,y,c){m.fillStyle=c; m.fillRect(x,y,3,3)}
  for(y=1; y<1000; y++){
  for(x=1; x<1000; x++){
  dx = (x-500)/2000-0.12
  dy = (y-500)/2000-0.82
  a = dx
  b = dy
  for(t=1; t<200; t++){
  d = (a*a)-(b*b)+dx
  b = 2*(a*b)+dy
  a = d
  H = d>200
  if(H){atom(x,y,"rgb("+ t*3 +","+ t +","+ t*0.5 +")"); break}
  }}}
  </script>
Enter fullscreen mode Exit fullscreen mode

The step by step tutorial and explanation is also available on YouTube for those interested:
https://youtu.be/mzizK6ms-gY



Enter fullscreen mode Exit fullscreen mode

Top comments (0)