The Mandelbröt Set

This JavaScript project creates the famous Fractal known as the Mandelbröt Set using HTML5's <canvas> element and allows students to explore its rich detail.

Between the chaos of what could be and the constraints (strange attractors) of what should be lies the domain of what is. All that is truly life lies exclusively within this domain yet beauty is most visible at its borders. All that is art is a reflection of this fundamental fractal.


This browser does not support the HTML5 element

Most of the time when people use the word "chaos" to describe the state or condition of something they use it as a synonym for the word "random". When dealing with the mathematical idea of fractals, however, an object in a random state is not the same as an object in a chaotic state. For an object to be in a truly random state a chosen set of properties of an object need to be known to be independent of each other. The image to the side of this text is a computer simulation of randomness. I say it is a simulation because in practice creating a truly random sequence of anything is difficult if not impossible especially for a digital computer system. With that being said, this image consists of a square of 256 x 256 pixels. Each pixel can have a color value determined by the value of three 8 bit numbers. Each number represents the amount of RED, GREEN, and BLUE light each pixel emits. The program responsible for creating this image runs every time the image is clicked on and every time the page is loaded or refreshed.

So from the view of the traditional definition of "random" this image simulates chaos in that each time it is clicked on or refreshed each pixel in the image appears to have a color unrelated to the pixels around it or to that pixels previous color. Try clicking on the image a few times to get an idea visually of what we usually mean when we think of something being "random" or "chaotic".


This browser does not support the HTML5 element

Display Size (Pixels)


Now the image to the side of this text and its associated controls begins as a low level rendering of the Mandelbröt Set. In the image discussed under the heading of chaos, the color of each pixel was minimally constrained to the range of colors available to it based on a 24 bit color code (consisting of three 8 bit color components).