4 ms·

Making a program to render a view of the Mandelbrot set is a fun exercise, I recommend it. I found a viewer that works in the browser: > Mandelbrot Viewer is

Making a program to render a view of the Mandelbrot set is a fun exercise, I recommend it. I found a viewer that works in the browser: > Mandelbrot Viewer is a universal (desktop and mobile) vanilla JS implementation of a plain Mandelbrot set renderer – supporting mouse, touch and keyboard interaction. https://mandelbrot.silversky.dev/ https://mandelbrot.silversky.dev/

brazzy 3y ago
Here's my attempt done a long time ago, not very polished: https://brazzy.de/en/Mandelbrot.php https://brazzy.de/en/Mandelbrot.php Even for that, the actual Mandelbrot calculations were the smaller part. It's really amazing how such a trivially simple formula spawns such endless complexity.
- rnentjes 3y ago
  I'll add my julia attempt that animates and works with webgl: http://julia.perses.games/ http://julia.perses.games/
- swayvil 3y ago
  Complexity is trivial. That's the lesson here. It's human perception that's special. It's special in that it has an uncommonly low bar on what's considered impressively complex. Which implies something important, no doubt.
QuadmasterXLII 3y ago
If you want to keep zooming in the browser and have snappy gpu accelerated performance while basically never hitting “reached limit of numerical precision,” check out https://mandeljs.hgreer.com https://mandeljs.hgreer.com . The math to make this possible gets pretty funky: I go over the tricks I used at https://www.hgreer.com/JavascriptMandelbrot/ https://www.hgreer.com/JavascriptMandelbrot/
- sapiogram 3y ago
  No scrolling with the scroll wheel though :(
  - QuadmasterXLII 3y ago
    The whole thing is a tower of spaghetti bit hacks in the name of depth and speed. Embarassingly, it actually can't actually render zoom levels that aren't powers of two and I'm not sure how to change that.
    - LoganDark 3y ago
      Can you make it so that the position you clicked stays at the same position after each zoom, rather than centering it on your cursor? That way you can click multiple times to zoom in on the same point.
- tda 3y ago
  Thanks for creating this, I had some fun exploring the set. What does the scale parameter stand for?
  - QuadmasterXLII 3y ago
    The color of each pixel is fragColor = vec4(vec3(cos(c), cos(1.1214 * c) , cos(.8 * c)) / 2. + .5, 1.); Where c is the number of iterations divided by the scale.
- deleted 3y ago
  [deleted]
- tweetle_beetle 3y ago
  That really is very fast! (I don't know if this is a known compromise of your technique (I couldn't find it mentioned), but I occassionally get a ring of varying thickness centred in the render with an inverted coluring to the rest of the pixels, or sometimes a solid colour. It varies is size and comes and goes without an obvious correlation to zoom level.)
crazygringo 3y ago
I made quite a sophisticated viewer as a teen, but boy was it slow to run back then, back on a 486. Now people write viewers that run lighting fast in a browser thanks to WebGPU! Like: https://www.reddit.com/r/fractals/comments/o7l4bm/please_try_my_gpubased_web_mandelbrot_set_explorer/ https://www.reddit.com/r/fractals/comments/o7l4bm/please_try...
- IronBacon 3y ago
  I remember as a teen I did mine in 68000 assembly on a Commodore Amiga to get it reasonable fast considering it was running on a 16 MHz CPU — i would say a few seconds to draw the canonical image — but IIRC it reached pretty fast the limit of math precision. At that time I didn't know what was a complex number, but was fascinated by the whole concept of fractals and how complex structures could be created with a relative simple program.
  - Baeocystin 3y ago
    A few seconds? Wow! I did a science fair project on the Mandelbrot set using my Amiga 2000, and it took me a good 45+ minutes to generate a single 320x200 color image. IIRC, I wrote the generator in some variant of Pascal, and was so happy with the performance increase over Basic on my C=128... I ran in to the precision limit pretty quickly, same as you. I didn't understand computers well enough to know that's what the problem was, and I remember spending hours pouring over my code, trying to figure out where the bug was. Good times. :D
    - vardump 3y ago
      The difference is probably you used floats and he/she used fixed point (integers). Of course that way you do run out of precision very quickly. Software emulated floats on Amiga 2000 were really, really slow.
    - IronBacon 3y ago
      If I'm not confusing it with something else, I seem to recall that when zooming on the set the calculation was nearly instantaneous. As you said, good times! ^__^ I still have that A500 but who knows where I put those floppies, I'm tempted to turn it on but I'm scared the PSU will blow itself...
matt-attack 3y ago
I did it in High School on my crappy TI programmable calculator. Took for ever to calculate but it worked.

brazzy 3y ago

Here's my attempt done a long time ago, not very polished: https://brazzy.de/en/Mandelbrot.php https://brazzy.de/en/Mandelbrot.php Even for that, the actual Mandelbrot calculations were the smaller part. It's really amazing how such a trivially simple formula spawns such endless complexity.

rnentjes 3y ago
I'll add my julia attempt that animates and works with webgl: http://julia.perses.games/ http://julia.perses.games/
swayvil 3y ago
Complexity is trivial. That's the lesson here. It's human perception that's special. It's special in that it has an uncommonly low bar on what's considered impressively complex. Which implies something important, no doubt.

QuadmasterXLII 3y ago

If you want to keep zooming in the browser and have snappy gpu accelerated performance while basically never hitting “reached limit of numerical precision,” check out https://mandeljs.hgreer.com https://mandeljs.hgreer.com . The math to make this possible gets pretty funky: I go over the tricks I used at https://www.hgreer.com/JavascriptMandelbrot/ https://www.hgreer.com/JavascriptMandelbrot/

sapiogram 3y ago
No scrolling with the scroll wheel though :(
- QuadmasterXLII 3y ago
  The whole thing is a tower of spaghetti bit hacks in the name of depth and speed. Embarassingly, it actually can't actually render zoom levels that aren't powers of two and I'm not sure how to change that.
  - LoganDark 3y ago
    Can you make it so that the position you clicked stays at the same position after each zoom, rather than centering it on your cursor? That way you can click multiple times to zoom in on the same point.
tda 3y ago
Thanks for creating this, I had some fun exploring the set. What does the scale parameter stand for?
- QuadmasterXLII 3y ago
  The color of each pixel is fragColor = vec4(vec3(cos(c), cos(1.1214 * c) , cos(.8 * c)) / 2. + .5, 1.); Where c is the number of iterations divided by the scale.
deleted 3y ago
[deleted]
tweetle_beetle 3y ago
That really is very fast! (I don't know if this is a known compromise of your technique (I couldn't find it mentioned), but I occassionally get a ring of varying thickness centred in the render with an inverted coluring to the rest of the pixels, or sometimes a solid colour. It varies is size and comes and goes without an obvious correlation to zoom level.)

crazygringo 3y ago

I made quite a sophisticated viewer as a teen, but boy was it slow to run back then, back on a 486. Now people write viewers that run lighting fast in a browser thanks to WebGPU! Like: https://www.reddit.com/r/fractals/comments/o7l4bm/please_try_my_gpubased_web_mandelbrot_set_explorer/ https://www.reddit.com/r/fractals/comments/o7l4bm/please_try...

IronBacon 3y ago
I remember as a teen I did mine in 68000 assembly on a Commodore Amiga to get it reasonable fast considering it was running on a 16 MHz CPU — i would say a few seconds to draw the canonical image — but IIRC it reached pretty fast the limit of math precision. At that time I didn't know what was a complex number, but was fascinated by the whole concept of fractals and how complex structures could be created with a relative simple program.
- Baeocystin 3y ago
  A few seconds? Wow! I did a science fair project on the Mandelbrot set using my Amiga 2000, and it took me a good 45+ minutes to generate a single 320x200 color image. IIRC, I wrote the generator in some variant of Pascal, and was so happy with the performance increase over Basic on my C=128... I ran in to the precision limit pretty quickly, same as you. I didn't understand computers well enough to know that's what the problem was, and I remember spending hours pouring over my code, trying to figure out where the bug was. Good times. :D
  - vardump 3y ago
    The difference is probably you used floats and he/she used fixed point (integers). Of course that way you do run out of precision very quickly. Software emulated floats on Amiga 2000 were really, really slow.
  - IronBacon 3y ago
    If I'm not confusing it with something else, I seem to recall that when zooming on the set the calculation was nearly instantaneous. As you said, good times! ^__^ I still have that A500 but who knows where I put those floppies, I'm tempted to turn it on but I'm scared the PSU will blow itself...

matt-attack 3y ago

I did it in High School on my crappy TI programmable calculator. Took for ever to calculate but it worked.