Interactive Fractals

Interactive Sierpinski Triangle

I am deeply inspired by fractals. They seem to represent the convergence of beauty and logic. In addition to being fun to play with, I love undertaking the challenge of understanding the math that they represent.

I made the following four interactive fractals using JavaScript and HTML5 Canvas, and you can play with them on the code-snippet showcasing website CodePen.

Click the fractal you want to interact with:

The fractal code is based on the tutorials presented by Coding Math.

Math Visualization Resources

As I continue to explore math, I notice how I feel lost when I cannot visualize what is happening. However, when there are visualizations available, I find them incredible. The following are resources that I’ve been using as I start my math education journey.

3Blue1Brown

3Blue1Brown’s YouTube channel is full of unique and incredible math visualizations. When I first started watching his videos, I thought that he painstakingly animated all of his content using standard animation software… but I was pleasantly surprised. He programs each of his visualizations using a Python library that he has developed over the years. He scripts each visualization to output to a video file.

His video on divergence and curl is an superb testament to the power of visualization.

GeoGebra

Another source of visual math insight is GeoGebra which allows you to visualize various proofs, matrix transformations, or higher math concepts with ease. The community uploads all kinds of teaching aids and resources.

Visualization made by Tim Brzezinski.

Desmos

Desmos is a deceptively powerful graphing tool that also has fascinating presets for those daring to explore. You can plug in your own equations with variables and enable sliders and animations.

Play with the Parametric Cycloid.

Brilliant

A dedication to making math intuitive is why I have a Brilliant subscription. Their courses contain many interactive examples going as high up as Differential Equations and Group Theory.

This polar coordinate flower visualization is a part of Brilliant’s Trigonometry course.

There is something about dragging a slider that makes things click in my head!

Beginnings

I have a giant (and ever growing) list of math visualizations that I want to program. It seemed right to start with the basics: a simple 2D Cartesian coordinate plane. Here’s a demo of using it to plot vectors that shows the panning and zooming functionality.

More programming math visualizations to come.

Why is geometry often described as “cold” and “dry?” One reason lies in its inability to describe the shape of a cloud, a mountain, a coastline, or a tree. Clouds are not spheres, mountains are not cones, coastlines are not circles, and bark is not smooth, nor does lightning travel in a straight line… Nature exhibits not simply a higher degree but an altogether different level of complexity.