Skip to content
A mandelbrot fractal viewer in javascript using svelte
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
public
src
.gitignore
LICENSE
README.md
package-lock.json
package.json
rollup.config.js

README.md

Mandelbrot viewer

A svelte application to visualize the mandelbrot set. Try online.

Screenshots

Screenshot 2019-06-04 at 23 08 55 Screenshot 2019-06-04 at 23 10 12 Screenshot 2019-06-04 at 23 18 36 Screenshot 2019-06-04 at 23 20 41 Screenshot 2019-06-04 at 23 22 21 Screenshot 2019-06-04 at 23 28 11 Screenshot 2019-06-04 at 23 34 01 Screenshot 2019-06-04 at 23 35 46 Screenshot 2019-06-04 at 23 38 48 Screenshot 2019-06-05 at 00 01 02 Screenshot 2019-06-05 at 00 13 24 Screenshot 2019-06-05 at 00 14 13 Screenshot 2019-06-05 at 15 12 08 Screenshot 2019-06-05 at 00 25 14 Screenshot 2019-06-05 at 15 00 42 Screenshot 2019-06-05 at 15 06 02

How to compile

This is a svelte application, it needs to be compiled.

To develop: npm run dev.

To build: npm run build (the resulting files are in the public folder).

Architecture

The fractal is split into square tiles.

Each tile has a position and a zoom level. Together, they determine which part of the fractal appears in the tile. There is a factor two between consecutive zoom levels: if a tile at zoom level 1 represents a square of size 1 in the fractal, then a tile at zoom level 2 represents a square of size 0.5, a tile at level 3 a square of size 0.25, and so on.

When the user zooms in, the set of tiles required to view the fractal in full resolution at the new zoom level is determined,and the computation of these tiles is launched in parallel on all available processor cores. Old tiles are not deleted immediately, instead they are scaled according to the new zoom level (which is fast), and displayed before the new tiles are available. When the number of old tiles grows too high, an heuristic is used to determine which one to delete.

All of this allows for a very smooth scrolling and panning experience, which I have seen in no other web based renderer so far.

You can’t perform that action at this time.