Messing Around With Trig

󰃭 2013-03-05

Yesterday after work I had some time to waste, so I decided to do some silly things in javascript with a canvas and some trigonometric magic.

Move your mouse around to change some variables, and click to toggle clearing of the canvas. You can achieve some trippy effects!

colorful sine wave sine wave

colorful flower flower

These are all on my github, in case you wanna take a look.

Tags: #canvas #fun #javascript #programming-projects

More posts like this

Starry Sky in HTML5 Canvas - Part 2

󰃭 2019-04-13 | #canvas #javascript #programming-projects #tutorials

This is part of a series! Please make sure you have read Part 1 first! IMPORTANT – you can try out the result of this tutorial by visiting this CodeSandbox. However, I encourage you to read the blog post and try to follow along to understand how and why it works. Last time we left off with a very nice starry sky, but it’s a bit dead. We need to add some animation to it!

Continue reading 

Rainbow Tunnel

󰃭 2013-03-07 | #canvas #fun #javascript #programming-projects

Today I had some more time to code something fun, so I decided to make a tunnel of sorts. The trick is really simple, first you just draw rings around the center of the page, and tweak their position a bit depending on the position of the mouse. To achieve the rainbow effect, you just have to make it so each ring has its hue value a little higher than the ring before it, and increase all of the rings’ hues each frame.

Continue reading 