Concept:
While researching randomly generated methods to implement in my code, I came across the Julia Set. A Julia Set is a set of complex numbers that do not converge to any limit when a given mapping is repeatedly applied to them. The primary purpose of this code is to provide an engaging way to explore the fascinating world of fractals and complex dynamics through visual art. It allows for a deeper appreciation of mathematical concepts by transforming them into a dynamic visual experience. This kind of interactive art can be used for educational purposes, artistic expression, or simply as a fun visual experiment (although it is extremely difficult).
Code Highlight:
class JuliaSet { constructor(cRe, cIm) { this.cRe = cRe; // Real part of the Julia constant this.cIm = cIm; // Imaginary part of the Julia constant } // Create particles based on the Julia set createParticles() { for (let i = 0; i < numParticles; i++) { // Random position for each particle let x = random(width); let y = random(height); let zx = map(x, 0, width, -2, 2); let zy = map(y, 0, height, -2, 2); let iter = 0; // Check if the point is in the Julia set while (zx * zx + zy * zy < 4 && iter < maxIterations) { let tmp = zx * zx - zy * zy + this.cRe; zy = 2 * zx * zy + this.cIm; zx = tmp; iter++; } // Create particles based on whether they are in the Julia set let brightness = iter < maxIterations ? 50 : map(iter, 0, maxIterations, 0, 255); particles.push(new Particle(x, y, brightness)); } } }
Key Components
- Particle System: An array called
particles
stores instances ofParticle
, representing individual points that are displayed on the canvas.. Mapping Mouse Movement: The
cRe
andcIm
variables are calculated using themap()
function, which transforms the mouse’s x and y positions to a range suitable for generating the Julia set (between -1.5 and 1.5).- Julia Set Creation: A
JuliaSet
object is created with the mapped constants, and itscreateParticles()
method generates particles based on whether points fall within the Julia set. - Each point on the canvas is tested using an iterative algorithm to see if it remains bounded (within a circle of radius 2) when applying the Julia set’s equation. If it does not escape, it belongs to the set.
- Particle Behavior: Each
Particle
is updated every frame using Perlin noise (noise()
) to create smooth, organic movements. The angle of movement is determined by the noise value, leading to a natural, swirling motion. - Particles are checked to see if they are within the canvas boundaries; if they exit, they are randomly repositioned.
- Brightness Calculation: The brightness of each particle is determined based on the number of iterations it took to escape the set. If the point escapes before reaching the maximum number of iterations, it is assigned a low brightness. Otherwise, its brightness is scaled based on how quickly it escaped.
Sketch:
Edit: https://editor.p5js.org/mariamalkhoori/sketches/M0NHDl7zU
Next Steps:
I want to expand the Julia set to take on a fuller shape across my canvas. So far, this is not what I had in mind at all, but working with such a new concept has been challenging, so I will pause here for now.
- Work on the generative aspect further.
- Refine the particle system, as I still feel it doesn’t meet the design I envision.
Advanced Mathematical Exploration:
- Different Constants: Allow users to explore different Julia constants (e.g., c values) by letting them input values directly or select from a preset list.
- Mandelbrot Set Comparison: Implement a feature to compare the Julia set with its corresponding Mandelbrot set, illustrating their relationship.
References
https://thecodingtrain.com/challenges/22-julia-set
https://paulbourke.net/fractals/juliaset/
https://fractalsaco.weebly.com/julia-set.html