(4/2/2025): A random idea I had a while ago and decided to put into reality. Generates random points on the screen, and connects them with a Minimum Spanning Tree. Then each frame, the points move slightly and the tree is recalculated. Over time, the tree wiggles and squirms and makes cool designs.

(4/3/2025, slightly after midnight): I improved the colors, stretched it past the canvas, and made it so the lines are thinner if they are longer and thicker if they are shorter, to make it seem like some stretchy alien substance being spread around.
(Later that day): I added some color variation. Each invisible point holds color information, and when an edge is drawn, it gets the average color of its two vertices, so that the colors don't strobe but we still get variation. I also added an additional, separate tree, drawn in thin white behind the main tree. But I'm not sure if I like this, so I turned it off. To turn it back on, run showExtra65 = true; in the console.

(12/30/2024): I came across this article about Genetic Algorithms in JavaScript. That led me to Coding Train's playlist about evolutionary algorithms, and I decided to try to implement one here. I haven't been able to really get it working, but the framework is there. The idea is that circles are rewarded for reaching the goal, or at least being close to it. Each circle's DNA is a series of random vectors that are applied as forces to the circle sequentially. Successful circles are more likely to reproduce and have part of their DNA be passed on. Eventually, after many generations, the circles should be much more successful.

(12/31/2024): I got a lot of the kinks worked out thanks to ChatGPT and Coding Train. Now I worked on improving the UI and the effectiveness of the algorithm. I improved the fitness function so that circles are rewarded even more for reaching the goal, and penalized more for hitting a wall. Also, the faster they reach the goal, the better. Finally, I added the ability to click to add obstacles for the circles to try to navigate through.
(Later that day): I tried to add genes for color along with movement, but I can't get it working right, and I'm worried I broke the movement code!

(1/1/2025): I couldn't fix what I broke, so I just went back to a version before the colors, and now it works normally again.
(Later that day): I finally got the color working. Now it works by dividing the DNA into sections, and then the vectors from those genes determine a random walk that determines, for example, the hue for that circle. This means the color of a circle roughly corresponds to the path it takes, meaning you can see clear color trends emerge as behavior also emerges. Also, I added a little line indicating the direction the circle is traveling in.

(1/3/2025): Added more details for watching the simulation evolve, like fastest finish time and best completion percentage.
(Later that day): I improved the circle coloring, Before, the color would be based on simulating the circle's path (from its genes), and then the distance from where it started would be converted into a [0-1] ratio. But this was very limited and didn't allow for a lot of variation. Now, I reworked how this is calculated.
- The hue of a circle is based on the direction it was traveling when it came the closest to the goal (or when it hit the goal, if that circle did finish).
- The saturation of a circle is based on how much the circle turned as it traveled, so that straigher paths are more dull, and more turn-y paths are more vibrant.
- The brightness of a circle is based on its maximum velocity, so that faster circles are brighter, and slower circles are darker.
(Even later that day): I added a new kind of object, this time a green checkpoint circle. You can (currently not without the console) click to add checkpoints, and if Use Checkpoints is enabled, then circles are rewarded based on the number of checkpoints they touched, instead of their final distance to the goal. This can help guide circles through paths that might take them Cartesianally farther from the goal, but still lead them in the right path.

(1/4/2025): Added lots of sliders and checkboxes for settings. I also improved the "Only show successful circles" behavior, so it can change in the middle of a generation, by simulating the rest of the generation. And, if no circles reach the end, it shows the circle that got closest, but with an X on it so you know it is doomed.
(Later that day): Improved this so it instead always shows the circle with the highest fitness, even if none reached the goal. Also, if no circles reached the goal, it shows the circle with the highest fitness and any circles that didn't crash, since they also will naturally have a higher fitness than the others.

(2/18/2025): Finally touched this again after over a month. I added some visuals to change what you are placing (along with an eraser to remove blockers/checkpoints), and added some more settings. I also finally improved placing so that you can click and drag Blockers and Checkpoints, which is MUCH easier to use.

(12/12/2024): A random thought I had after finishing my U. Phys II final. I was thinking about what the motion would look like if you had a line where gravity switched directions - essentially so that the top of the line you would be attracted downwards towards it as GmM/r^2, and below it it would be the same but upwards. I realized pretty quickly that what I was picturing wouldn't actually work like I imagined, with an object smoothly oscillating above and below the line, since the force blows up to infinity as you cross the boundary. So instead, I made gravity work like Hooke's Law, with F = -kx for some displacement x. This creates a nice simple harmonic motion. But then it got me thinking...I essentially created a spring *field*, where it's like a spring is attached to the mass at all points in space. I want to derive what the formula for an S-Field would look like, compared to a B-Field or E-Field. For instance, what if you have an infinite continuum of springs in a straight line, all invisibly connected to the mass?
(12/30/2024): Well, I looked into the math, and unfortunately it doesn't work. Since springs get more powerful the further stretched they are, an infinite line (or sheet) of spring particles results in an infinite force on the test mass. So sadly, this isn't going to work. Only with a finite number of springs will this even be possible to model.

(9/20/2024): I coded this up quickly during Math Club to run a Monte-Carlo simulation of this problem:

Where you need to calculate the area of the region. This simulation randomly chooses a coordinate and calculates if it is in the region, keeping track of how many fall inside and outside the red region. This gives us a really rough approximation of the area.

(7/31/2024): This started out as a variation on circle packing, where circles grow until they reach the center of another circle, not the edge. But, this was super underwhelming, so I added separate code that sorts the circles based on their radius and distance from the mouse cursor, so now there's a really cool layered effect as they all come towards the center, and you can drag it around. I added colors and other visual settings as well.

(8/1/2024): I've been improving something I started on yesterday that I call "eyeball mode." The colored circles are still the default, but as an alternative that could (maybe) be a generative art piece, I turned the circles instead into eyes that look at the center. Today I improved the design of the eyes, giving the irises some lines and improving colors. I also added a larger center eye that all of the other eyes are looking at.
(Later that day): I added an early version of the red squiggles you see in disembodied eyeballs, using random walkers, but I'm not super satisfied with how it looks at the moment.

(8/5/2024): I finally got the eye squiggles in a state I'm happy with; it now draws using a pre-set path that it randomly jumps to the left/right of along the way. They also get smaller as they go along the eye, which improves the look a lot.
(Later that day): Fiddled with the size settings so now the eyes tend to be larger in average, so the design is less small and detailed and can be seen better without having to zoom in. Also, I made the discovery that having the veins start under the pupil (not after it) makes the eye look a lot better.

(7/28/2024): This is just the barebones structure for an idea I had. It generates a random assortment of concentric rings, which currently are just solid rings. But, the idea is that there would be tons of different modes to fill that space with - like a ring of touching circles, or zig zags, etc.

(7/29/2024): Got the first ring implemented! It's a connected ring of circles. I added some global variables to control the overall shape. Skew affects how random the shapes are placed; Density affects how close together the shapes are placed; and Complexity discretely increases the number of details, accents, and other added features.

(7/30/2024): Messed around with some parameters for Ring 0. I also added Ring 1, which is a ring of quills pointing towards the center of the circle, with complexity adding concentric circles in the middle of the quills.

(8/2/2024): Improved Ring 0 double-line at complexity 1/2. I also finally got Ring 2 working! The idea is to have Ring 2 be a solid ring of alternating triangles, with the triangles getting more spaced apart with less density. I finally fully implemented this ring today. I also added sliders for density, skew, and complexity.
(Later that day): I added Ring 3, which is a random sinusoidal squiggle, using the curve smoothing algorithm from Project #3.58. More complexity adds a second wave with a phase shift, and later makes each wave have thickness.

(7/19/2024): This project began, as all good projects do, with a Stack Exchange question. One of the commentors included a picture of the integers arranged in a square, where each number is subdivided based on its prime factors, and each slice is colored based on that prime. So 4 is made of 2 red blocks for 2×2, while 78 is a red 2, a yellow 3, and a brown 13. I thought this was really cool and decided to implement it here, with a psuedorandom number generator for coloring based on the prime factor. Each prime number is represented as an outlined white square so they stand out.

(7/24/2024): Added random grid size to the Redraw button so it actually does something.