Digital Analog Clock
The name says it all. It's an analog clock on a digital screen, so it's a digital analog clock.
Go to Digital Analog Clock
Orbital Comparison Simulator
I was browsing reddit one day, and I came across a reddit post that detailed the orbital relationship between Earth and Venus. Specifically, it highlighted an interesting pattern with five-fold radial symmetry that appears if you draw a line between the two planets for 8 revolutions of the Earth and nearly 13 revolutions of Venus. That post inspired me to make this, which simulates the same type of pattern between two planets with customizable orbital speeds. The simulator defaults to the comparison between Earth and Venus, which traces out a pattern with five-fold symmetry.
Go to Orbital Comparison Simulator
Spirograph
Shortly after I finished the orbital comparison simulator, my mother saw it. She told me I had made an electronic spirograph, so I looked up what that was. I realized that in fact, I had not made a spirograph, so I went and made one. Based on Hasbro's toy, it draws hypotrochoids, hypocycloids, epitrochoids, and epicycloids.
Go to Spirograph
Digital Doily
Another project inspired by reddit. This time, I came across the Amaziograph, which someone said should have been called a "Digital Doily," and I wanted to try to make something like it, so I did. Credit to the name "Digital Doily" goes to /u/barndin.
Go to Digital Doily
If you are finding that Digital Doily tends to slow down, you may want to try an older version, which can be found here.
Fractal Tree
This was my first Javascript project. I know, the projects are a bit out of order, but they're in the order I've posted them in. I had seen some of these fractal trees and wanted to see the math behind it. Shortly after, I was making this.
Go to Fractal Tree
Dancing Fractal Tree
Shortly after completing the normal fractal tree, I saw an article which depicted a fractal tree that moved depending on where the mouse was. I wanted to see if I could do it, so I got to work and ended up with this. Following the red line will give a symmetrical tree, with 135 degree angles popping up at the intersection with the blue line, and 120 degree angles at the intersection with the green line. Right angles can be found at the bottom right corner of the canvas.
Go to Dancing Fractal Tree
Bezier Curve Model
I was reading about Bezier Curves a while back, and I wanted to see how they were made, so I made this model. For those of you wondering what the heck a Bezier Curve is, it's a spline-based curve used often in computer graphics.It's formed from several anchor points, then you connect those points with lines, connecting them in order. After that, you place a point on each of those lines at say 20% from the start. You then connect those points in order and place the points at 20% on those lines again, and repeat the process until you just have one line and one point in a single layer. You then trace that final point as you move all the points from 0% forward to 100%, and that's your final Bezier Curve. In computer graphics programs like Photoshop, you will often find Bezier Curves with four grab points, and those curves are known as cubic Bezier Curves.
Go to Bezier Curve Model
Word Counter
When writing an English paper, I often look at the character count and word count just for fun, but when I look, I want to know more. I want to know how many times any given word shows up. So I created this: you paste in your text, and then colored bars of different lengths pop up to represent different words and how often they appear. Hover over a bar to see what word it represents, along with the amount of times that word appears in the text. Try using this with a Google search, they give some interesting results.
Go to Word Counter