Mandelbrot and Julia — Mathematical visualization and beauty

I have been fascinated by the idea of chaos theory since I read about the butterfly effect. I read some more about it in the book ‘Chaos’ by James Gleick including about the Mandelbrot. But until I read ‘Make your own Mandelbrot’ by Tariq Rashid I did not realize just how simple the equation to draw the Mandelbrot was.

This is the innocuous looking equation that generates the awesome Mandelbrot Set.

Mandelbrot Formula

A slight change in the input to the same equation will give the Julia set. It gives rise to a complicated boundary that reveals a recursive aspect; there are many smaller sized Mandelbrot one can see as one zoom’s in.

To learn more — look at this video — “What’s so special about the Mandelbrot Set?”

So I used the code from the book (python) to get the Mandelbrot set and the Julia set. I also got to see the 3D surface close ups (after smoothing).

Mandelbrot Surface 3D

Julia Surface 3D

But the fun of the Mandelbrot is when one can zoom in and see the beautiful patterns interactively.

After a bit of search (and multiple tries), I was able to finalize on JavaScript code works reasonably without needing specific libraries or frameworks or threads. I also improved on the color palette, to get brightly colored areas to observe the beauty of the mathematical patterns.

Following is the core of the Mandelbrot code. This calculates the value of the function for a maximum number of iterations.

Code

Ref : https://rembound.com/articles/drawing-mandelbrot-fractals-with-html5-canvas-and-javascript

This is the code for Julia set.

Ref : https://rosettacode.org/wiki/Julia_set

I chose a more colorful palette.

Ref : https://rosettacode.org/wiki/Julia_set

Results

Using mousedown to zoom in, ctrl to zoom out and shift to pan in the Mandelbrot and Julia results, some of the images / gifs obtained are shown below.

Links to the live demo are also mentioned at the end of the post.

Mandelbrot Gif

Julia Gif

Mandelbrot Image 1

Mandelbrot Image 2

Mandelbrot Image 3

Mandelbrot Image 4

Mandelbrot Image 5

Mandelbrot Image 6

Mandelbrot Image 7

Mandelbrot Image 8

Julia Image 1

Julia Image 2

Julia Image 3

Links

1. Live Demo — Mandelbrot
2. Live Demo — Julia
3. Full Code Mandelbrot in JS
4. Full Code Julia in JS
5. Python notebook with 3D images — Mandelbrot
6. Python notebook with 3D images — Julia

References :

1. Make your own Mandelbrot — Tariq Rashid

If you don’t know programming or mathematics, and want to start from scratch to understand the concept behind Mandelbrot in clear, simple and step-by-step manner, this book is great. Short (only ~130 pages), with plenty of illustrations, easy to grasp. Its only con is that the code is in Python 2.7.

2. HTML5 Canvas and Javascript — Main resource for the javascript code for zoom and pan function.

3. Color palette — Simplest color palette code for a wide range of colors

4. Various values of C for Julia sets

5. Color Inspiration