Max. iterations This value describes how many times the script is allowed to iterate each pixel. The higher the value, the better the resolution, but more time is required to generate.
X offset This value sets the offset for the generated set along the x axis. Higher numbers push the set to the right, and lower numbers push it to the left.
Y offset This value sets the offset for the generated set along the y axis. Higher numbers push the set to the bottom, and lower numbers push it to the top.
Zoom This value sets the zoom for the set. The lower the number, i.e. closer to zero, the further into the set, and the higher the number, further out from the set.
S - Scale mode Click and drag to select a part of the fractal. You can move the selection around if needed. Click enter to generate, escape to cancel.
M - Move mode Drag the entire rendered image. If a different zoom value is input, a rectangular selection box will appear in the center to ease framing.
E - Escape mode Move your cursor over the set. The script will display the positions of complex numbers for each cycle of the rendering algorithm until it escapes. A popup will also appear that displays the absolute value of each complex number in a plot to show how the input escapes, which happens when the line hits the top of the plot area.
I - Info mode Move your cursor over the set. The script will display the amount of iterations and position for that point.
G - Generate Generate a new set. Edit the function in the function panel.
F - Function (ordinary) Edit the function used to render a fractal. It's not picky with the input, but requires one constant for a Mandelbrot set (power, default is 2), and two or more constants for Julia sets. Note that the script automatically selects which settings are input if only two constants are present. z2-0.5 will be parsed as z2-0.5+0i and z2-0.5i as z2+0-0.5i, for instance.
F- Function (advanced) Edit the function, but with more advanced input. This mode supports more advanced mathematical operations to describe constants in Julia sets, such as trigonometry, roots, and variables (x and y).
C - Color scheme Set a different color scheme for your set. The mod value describes how often colors are repeated.
U - get URL Get the shareable URL for your set!
Esc Pretty basic stuff. Closes popups.
Enter Generate new set.
Complex numbers Mandelbrot/Julia sets are fractals based on the properies of complex numbers, written as a+bi, where a and b are real numbers and i is an imaginary unit, equal to the square root of -1. For the record, bi=b*i, which makes bi an imaginary number, with b as a "real number coefficient". All complex numbers can be plotted in a two-dimensional coordinate system, the complex plane, where a represents values on the real axis (x-axis), and bi represents the imaginary axis, thus taking on the role of the y-axis in the normal coordinate system. Every complex number in the system is represented by a point. 2+3i is a point two steps away from the origin along the x-axis, and three steps away from the origin along the y-axis, for instance.
How Mandelbrot sets are generated pt. 1: Iterations The mandelbrot set follows this formula: z2+c, where z is the complex number from the previous iteration (I'll explain what that means in a second), and c is the complex number described by the point that is generated. Okay, this sounds confusing, so let's begin with c. A generated set is an image, and so contains a lot of pixels. Imagine each of those pixels is a point in the complex plane, which makes each pixel describe a complex number c which changes for every pixel position in the image. Now, I said z was the result of the previous iteration, so here's how this works: We start by saying z=0 (0+0i, if you're pedantic; this initial value is also called the orbit of the function, and for mandelbrot sets, this is always 0), and so z2+c=c. Now, take the result (=c) and put it into the formula, c2+c=d. Again: d2+c=e, and again, e2+c=f, etc. c,d,e, and f are all complex numbers. The next step is to investigate how these new numbers behave.
How Mandelbrot sets are generated pt. 2: Escape time Okay, let's investigate these new numbers. We need to get a grasp of where these new numbers lie in the complex plane, so we use the absolute value of the complex number. The absolute of a complex number is the hypotenuse in a right triangle with sides a and b (i.e. the components in the complex number). abs(c)=sqrt(a2+b2). The good thing is that we get a single value, and best of all, it's a real number!. If the absolute is small, that means that the complex number is close to the origin, and the opposite if the absolute is large. It has been proven that if the absolute exceeds 2, no new generated complex number will have an absolute value less than 2, and thus diverge to infinity. If, for any value of c, the sequence diverges, it doesn't belong to the Mandelbrot set. If, on the other hand, no new number reaches an absolute of 2+ during a set number of iterations, it does. The time (number of iterations) it takes for a series to reach abs(z2+c)>2 is called the escape time.
How Mandelbrot sets are generated pt. 3: Colors This part is a little easier than generating the set. If the sequence remains bounded, i.e. no complex number in the series has an absolute value larger than 2, that pixel is colored black to show it belongs in the set. Conversely, if it has escaped, a color is picked according to escape time, which is denoted as a number. The number is then placed on a color scale, and depending on where it is on the scale, a color value can be read. This is what causes those beautiful color gradients!
What about Julia sets, then? The mandelbrot set uses the form z2+c, and Julia sets use the form z2+a+bi, with the first value of z=c, instead of 0 (which as you might know by now, is the orbit of Mandelbrot sets). That's the main difference. Instead of a variable (ex. c), a Julia set uses a single complex number for each pixel. Otherwise, they're generated the same way as Mandelbrot sets.
Searching for a higher power? The Mandelbrot set was first defined as z2+c, but any other power will work, such as z4+c. This web app accepts any integer power value larger or equal to 2. For power 2, the code uses a simple formula to generate the next number. For higher powers, this becomes inefficient, as you need to loop through the algorithm. Fortunately, there exists a formula, de Moivre's formula, which lets you put in any integer power and outputs the complex number in polar form, which is a different way to describe complex numbers than a+bi (read more about polar form here). This way, Mandelbrot/Julia sets with powers exceeding, say, 100 are fully possible to generate in reasonable time.
This is roughly how the script iterates input values for sets with power 2:
function generateIndividual() for power 2 with cartesian coordinates:
for (var h=0;h<height;h++){
for (var w=0;w<width;w++){
a2=(w-width/2-xOff/zoom)/(500/zoom);
b2=(h-height/2-yOff/zoom)/(500/zoom);
if (isMandel){
a=a2;
b=b2;
}else{
a=julA;
b=-julB;
}
pixels.push(generateIndividual());
}
}
function generateIndividual() for powers >2 with polar coordinates using de Moivre's formula:
for (var i=0;i<max_iterations;i++){
if (a2*a2+b2*b2>=4){
return i;
}
Suppose c is a complex number d+ei, and (a+bi)^2+c=a^2+2abi-b^2+d+ei, thus a^2-b^2+d(real part, a2) and 2*(a+bi)+ei(imaginary part, b2)*/
aTmp=a2;
a2=a2*a2-b2*b2+a;
b2=2*(aTmp*b2)+b;
}
return -1;
for (var i=0;i<max_iterations;i++){
if (a2*a2+b2*b2>=4){
return i;
}
v*=power;
magnitude=Math.pow(Math.sqrt(a2*a2+b2*b2),power)
a2=magnitude*Math.cos(v)+a;
b2=magnitude*Math.sin(v)+b;
}
return -1;
This web app was written by PicturElements, starting in June 2016.
License:
MIT License
Copyright © 2016, PicturElements
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
You have been linked to a user-created set. Please make sure that the generating function looks good and doesn't contain any suspicious code:
Check that the text in the gray box contains things that look like ordinary mathematical expressions, like z^4+sin(45)-(0.5)i, for example. Anything that looks like a mathematical formula is safe to run.
This web app uses a "sneaky hack" to speed up some processes. Mean-spirited people may find a way to sneak code into the share URL which could cause some damage. The popup eliminates this risk.
This web app uses mathematical functions in two different forms to render sets. The simpler form uses a small piece of info, like "z2+0.1-0.5i", which is easy to write a script for to translate into meaningful data. However, some functions are more complex, and while it is possible to write a script that translates such input, it is more time consuming, as sometimes the script must be run for every single pixel. There is a (slightly) better way! By separating the input into its meaningful components, it is possible to turn this data into actual JavaScript code.
When a set with more complicated input is generated, the script injects a small piece of code into the page which it can call whenever necessary. By doing this, the script can run (almost) as fast with complicated input as with simple input.
But injecting scripts is dangerous. This is the basis of Cross-site scripting and is a big issue for many users and websites. This is why the alert pops up. It lets you inspect the input before the script is allowed to intervene with it, thus minimizing the risk of malicious code being run.
It should be noted that it is very unlikely that malicious code would be let through the script-generating script, because most code wouldn't make it through parsing, so this is just a security measure.