This is an expanded reply to a comment on Lobste.rs about my current project, a math expression visualizer.
The point is to get insight into what is going on inside a mathematical expression. We'll start easy:
The height bar above the number is its value. Try changing the number to 2
.
If you put x
instead of 1
, you can separate the value from the expression. If you want to see how the expression changes when x
changes, select "variable" and drag the slider.
Level 2: operations
When you put 1+1
into a normal calculator or wolfram alpha, it will tell you, 2
. My visualizer says 2
as well (you can see a taller bar over the whole 1+1
expression), but it says more, it shows all the work. You can still see the height-1 bars over each 1
. It shows you what values went into that +
that gave you the sum.
As before, try swapping out one or both 1
s for another number or for x
.
Level 3: nested operations
remember BEDMAS? You have to do the (M)ultiplication before the (A)ddition, so to solve you go 1+2*3 == 1+6 == 7
. You can see all of that work in the bars of the visualization: bars of heights 1, 2, 3 over the numbers, a bigger one (height 6) over the 2*3, and the final value (height 7) over everything (1 + 6).
That's pretty much it. I have this to play with now and try to make cool-looking graphs with, instead of the graphing calculators we had in high school, where I always tried to make cool-looking graphs, but never knew what was going on inside my fantastic complicated random expressions and they all sucked.
Bonus: things I like so far
The expression linked in my original comment was the trig identity sin(t)^2 + cos(t)^2
which always equals 1
. As you slide the value of t
, you can see that the bar over the sum never changes -- it's one. You can see the pieces that are added together that make 1, and how to the ^2
fixes the sin
and cos
outputs to be just right. To see just how important the power 2
is, try abs(sin(t))^p + abs(cos(t))^p
.
I don't think I've ever seen the mod operator visualized, here it is: x%1
. In real life when I use %
, I think the right side is always some constant, but it doesn't have to be! x%(6-x)