Below you will find recreational computer challenges. Their purpose is to introduce concepts in
object oriented programming (OOP), famous numerical techniques, famous bioinformatics algorithms or
simply help you dive in the current web technologies. The languages used will be C++,
Python and possibly JavaScript associated to HTML5. For the animations and interactivity that you will discover below,
we used p5.js libraries.
p5.js is a recent interpretation of Processing written in JavaScript that makes it easy to interact with HTML5 objects,
including text, input, video, webcam and sound.
p5 is an interpreted programming language which promotes processing and sketching as an easy learning programming method.
Each computer challenge is divided into three sequential frames :

The stated problem;

The solution to the problem and results;

A proposed code implementing the way to solve the problem.

Of course, it is recommended that you try to solve the problem on your own and find a better solution
than the one you will find here :

Computer challenge #1 : The Diffusion Limited Aggregation algorithm.

This problem is known as the DLA, &laquo Diffusion Limited Aggregation &raquo, and is fully documented on Wikipedia.
It was first proposed in 1981 by Witten and Sander in an article entitled &laquo Diffusion limited aggregation,
a kinetic critical phenomena &raquo in Physical Review Letters, number 47.
In DLA, model particles are added,
one at a time, to a growing aggregate (cluster) of particules via random walk trajectories. The
particules are imagined to have come from infinity but are actually lauched from a random position on a contour which encloses
the seed aggregate. At some point in the random walk of the particle, if the particle comes at a close distance from
the aggregate, it sticks to it. The aggregate has now grown larger and a new random particle is launched. The term
&laquo Diffusion &raquo means the particules forming the structure wander around randomly before attaching
(&laquo Aggregating &raquo) to the structure. It is called &laquo Diffusion Limited &raquo because the particules are
considered to be at low concentrations so they don't interact which each other and the structure grows one particule
at a time and not by chunks of pre-aggregated particules like it would be the case in coagulation and flocculation.
Practical examples
are found in coral growth, snow crystal growth, percolation phenomena, lightning paths, etc.
There are a number of ways of simulating this process by computer, perhaps the most common is to start with a white
image except for a single black pixel in the center. New points are introduced at the border contour and randomly
(approximation of Brownian motion) walk until they are close enough to stick to an existing black pixel. In a first
simple version, the random walk can be simulated in a 2-D lattice where a drunk ant has a clock and a coin. At each
node position of the ant, and at each tick of the clock, the ant toss a fair coin twice. At the first toss, if it is
heads or tails, the ant will move horizontally or vertically; at the second toss, the ant will move in one direction
or the other. At subsequent ticks of the clock, the ant do it again and again until eventually, it reaches the aggregate.
To speed up the algorithm a bit, if the ant finds itself in a position very far away from the aggregate, the ant is
annihilated and a new one is lauched from the border contour. In a more general version of the algorithm, the 2D-lattice
simplification is relaxed and the ant may now move in any direction : this is the off-lattice algorithm.

Hints for a solution and results

What is the final result you have to achieve ? Bring your mouse cursor inside the left frame just below and you will see what
Diffusion Limited Aggregation really is. The challenge is to reproduce this animation.
Additional questions of interests might be the following :

Find out the growth dynamic of the aggregate, i.e. what is the relation between the number
of pixels added to the aggregate and the elapsed time or the relation between the weight of the aggregate and the vertical
(horizontal) distance between the most distant two pixels belonging to the aggregate ?

What is the fractal dimension of the aggregate ?

What is the variation in entropy for the system (system = random walkers + aggregate) during the build-up of the aggregate ?

On what assumptions depend the expression of the entropy ?

Can you achieve a three dimensional extension of this algorithm and its graphical representation ?

To gain further insights on the dynamic geometrical properties of the aggregate while being built up,
please click the mouse inside the animated frame. You will get elapsed time, aggregate box lengths,
aggregate count and weight.
Collecting these data sequentially and plotting them in a log-log scale will provide the fractal
dimension as the slope of curve (log of aggregate density versus log of aggregate length geometric mean).
A deeper treatment of DLA fractal properties can be found in
Bunde, A. and Havlin, S. Fractals and Disordered Systems, Springer-Verlag, 1991.

Code extracts in JavaScript with p5.js libraries that produced the solution above:

The animation above shows how powerful Javascript and the P5 associated libraries are in interacting with HTML5 to
produce nice dynamical pictures which also can interact with the web end-user.
To set up the code for the DLA algorithm, it is recommended to build the random walker as an object.
Then, you will probably want to create a bunch of such random walkers by setting up an array of this object.
The random walker attributes are up to you but you certainly will have to include the walker position, its size
(radius), a stuck status (is it or not stuck in an existing aggregate?), its color, the time elapsed before it stuck,
etc... The methods in the object should include a display function, a random move function, a boolean function checking
for the stuck status after a move. Make sure there is no overlapping between stuck random walkers : each pair
of tangent stuck walkers may not overlap any existing stuck walker.
Now, once a walker has been stuck to the aggregate, it disappears (use the .split() method in JavaScript).
Doing so, the aggregate is enriched by the stuck walker (use the .push() method in Javascript to append
the array of the previously stuck walkers which is also built indeed as an array of walkers with special attributes).
The algorithm and code for this animation was freely inspired from nice P5.js tutorials shown on Youtube by Dan Shiffman.
You can download here the complete JavaScript code I used ('sketch.js').

This computer challenge is about drawing the famous Mandelbrot set, the archetypical fractal object.
The Mandelbrot set is the green figure you can see here in the background image.
We want to combine Object Oriented Programming in C++ with the use of a graphic format called .ppm
(portable pixmap format). This format is fully
described on the web. Basically, a ppm file ("file.ppm") contains a three lines header and data triplets representing
the color of each pixel to be drawn in RGB coding format. The three header lines are "P3" (first header line which
is the format definition with end of line character), two integer numbers like 500 500 (second header line with
the number of pixels in width and the number of pixels in height also with the end of line character),
an integer number (third header line which is the maximum color value used in RGB coding also with the end of line
character). The rest of the file contains all data triplets for the pixels. For instance
the RGB (red green blue) triplet for pixel one could be 255 0 0 (the pixel would be red) or 0 0 0 (black pixel)
or 255 255 255 (white pixel). A ppm file cannot be read by all graphical softwares. You will need, for instance,
the GIMP software to read such files and most importantly to display the image. GIMP stands for GNU image
manipulation program and is open source. You are advised to download the GIMP software before you start
this computer challenge. Once you will have produced a ppm file with your C++ program, you will be able to
display the image and to export it in other image formats (like .jpg or .png). You will have to prepare or
use an existing header file (.h) in your C++ project implementing
a Complex class (dealing with attributes, i.e. properties, of complex number ∈ ℂ, like
their real and imaginary parts and their methods: for instance how the modulus of a complex number is calculated,
or how two complex numbers are summed up or multiplied, how do you compute the power of a complex number, etc...).
Finally, in the main C++ program, you will have to instanciate your complex number object. The procedure to determine if
a complex number belongs or not to the Mandelbrot set is fully documented in Wikipedia. To spell it out simply: a
complex number c ∈ ℂ belongs to the Mandelbrot set, if starting
from z0 = 0, taking the second power of z, adding c to get the next z; then repeating this iteratively a number of times n
to infinity, and finally checking if all z do not diverge. If they don't diverge or are all bounded, then c belongs
to the Mandelbrot set. Equivalently,
if the modulus of z remains smaller or equal to 2, whatever the number of iterations, then c belongs to the set.
Of course, you should fix the number of iterations to a maximum integer value (256 for example in our code).

Hints for a solution and results

Prepare a C++ header file to create a complex class with properties (attributes) relevant to complex numbers (real, imaginary).
Implement methods for this Complex class : modulus of a complex number, and more if you want...
In your C++ main(), read from a .txt file, the limits of the Complex plane you want to investigate (see a figure of the
Mandelbrot set in Wikipedia : x range from -1.5 to 0.7 and y range from -1.0 to 1.0), the maximum number of
iterations you will carry out for the Mandelbrot set procedure (here we fixed 256). In this .txt file also get the
relevant information on the size, i.e. number of pixels, you want to output for your final ppm file to be produced :
for instance 512 times 512 = 262,144 pixels for the entire produced image.
Actually, we advise you to have 7 pieces of information in your input file (.txt) : ImageWidth, ImageHeight, MaxValueofN
in the Mandelbrot formula, minReal, maxReal, minImaginary, maxImaginary.
Create appropriate functions to sum two complex numbers, to multiply two complex numbers, to take the power of a complex
number if these operations are eventually useful.
Map the real and imaginary part of c in the .ppm file for all c scanned (for loops) from the input section of the complex plane.
The rgb triplet values of a pixel can be varied mathematically for different colors results depending on the observed number of iterations that were
reached before z diverges (while loop in the function maxNumberOfIterationsMandelbrot). The header lines for the ppm format are written with all data triplets for all pixels
in an 'output_image.ppm' file that you will eventually open with GIMP to display the result.

Code extracts that produced this drawing:

Part of the code was freely borrowed from a nice and fast youtube video about programming the Mandelbrot set in C++ :
https://www.youtube.com/watch?v=entjSp3LIfQ.
The relevant input information you might need and you can read in an input file called "inputMandelbrot.txt" are :