Embeddable Graphs

April 3, 2013

Going beyond just polynomials, I’ve created a javascript graphing app that’s easily embeddable.

At the moment, it just does polynomials and points, but polynomials can be used to teach quadratic functions (parabolas) and straight lines to pre-algebra and algebra students. Which I’ve been doing.

Based on my students’ feedback, I’ve made it so that when you change the equation of the line the movement animates. This makes it much easier to see what happens when, for example, you change the slope of a line.

P.S. You can also turn off the interactivity if you just want to show a simple graph. y = x2-1 is shown below:

Citing this post: Urbano, L., 2013. Embeddable Graphs, Retrieved May 30th, 2017, from Montessori Muddle: http://MontessoriMuddle.org/ .
Attribution (Curator's Code ): Via: Montessori Muddle; Hat tip: Montessori Muddle.

The Algebra of Straight Lines

April 2, 2012

A quick graphical calculator for straight lines -- based on This. It's still incomplete, but it's functional, and a useful complement to the equation of a straight line animation and the parabola graphing.

You can graph lines based on the equation of a line (in either the slope-intercept or point-slope forms), or from two points.

Straight Lines

Slope-Intercept Form Two Points Point-Slope Form
y = m x + b (x1, y1) =
( , )
y - y1 = m ( x - x1)
y = x +

(x2, y2) =
( , )
y - = ( x - )

x intercept: Slope: Equation:
y intercept: Points:
Your browser does not support the canvas element.

Citing this post: Urbano, L., 2012. The Algebra of Straight Lines, Retrieved May 30th, 2017, from Montessori Muddle: http://MontessoriMuddle.org/ .
Attribution (Curator's Code ): Via: Montessori Muddle; Hat tip: Montessori Muddle.

Everything You (N)ever Wanted to Know About Parabolas

March 7, 2012

So that my students could more easily check their answers graphically, I put together a page with a more complete analysis of parabolas (click this link for more details).

Analyzing Parabolas

Standard Form Vertex Form
y = a x2 + b x + c y = a (x - h)2 + k
y = x2 + x +

y = ( x - ) 2 +

Intercepts: Vertex:
Focus: Directrix: Axis:
Your browser does not support the canvas element.

Solution by Factoring:

y = x2 x

Converting the forms

The key relationships are the ones to convert from the standard form of the parabolic equation:

         y = a x^2 + b x + c (1)

to the vertex form:

         y = a (x - h)^2 + k (2)

If you multiply out the vertex equation form you get:

         y = a x2 - 2ah x + ah2 + k (3)

When you compare this equation to the standard form of the equation (Equation 1), if you look at the coefficients and the constants, you can see that:

To convert from the vertex to the standard form use:

         a = a (4)
         b = -2ah (5)
         c = ah^2 + k (6)

Going the other way,

To convert from the standard to the vertex form of parabolic equations use:

         a = a (7)
         h = \frac{-b}{2a} (8)
         k = c - ah^2 (9)

Although it is sometimes convenient to let k not depend on coefficients from its own equation:

         k = c - \frac{b^2}{4a} (10)

The Vertex and the Axis

The nice thing about the vertex form of the equation of the parabola is that if you want the find the coordinates of the vertex of the parabola, they're right there in the equation.

Specifically, the vertex is located at the point:

         (x_v, y_v) = (h, k) (11)

The axis of the parabola is the vertical line going through the vertex, so:

The equation for the axis of a parabola is:

         x = h (12)

Focus and Directrix

Finally, it's important to note that the distance (d) from the vertex of the parabola to its focus is given by:

         d = \frac{1}{4a} (13)

Which you can just add d on to the coordinates of the vertex (Equation 11) to get the location of the focus.

         (x_f, y_f) = (x_v, y_v + d)  (14)

The directrix is just the opposite, vertical distance away, so the equation for the directrix is the equation of the horizontal line at:

         y = y_v + d  (15)

References

There are already some excellent parabola references out there including:

Citing this post: Urbano, L., 2012. Everything You (N)ever Wanted to Know About Parabolas, Retrieved May 30th, 2017, from Montessori Muddle: http://MontessoriMuddle.org/ .
Attribution (Curator's Code ): Via: Montessori Muddle; Hat tip: Montessori Muddle.

Euler’s Method for Approximating a Solution to a Differential Equation

March 3, 2012

Based on Euler's Method, this interactive graph illustrates a numerical method for solving differential equations. This approach is at the core of many sophisticated computer models of physical phenomena (like climate and weather).
  • Starting point: (x,y) = (   ,   )
  • Step size:
  • Direction:
Your browser does not support the canvas element.
  • Slope equation: dy/dx =   x +   
  • Show analytical solution:
If you know the equation for the slope of a curve (the red line for example),
and a point that the curve passes through, such as , you can integrate to find the equation of the curve:

If you don't have a starting point (initial condition), you can draw a slope field to see what the general pattern of all the possible solutions.

Even with a starting point, however, there are just times when you can't integrate the slope equation -- it's either too difficult or even impossible.

Then, what you can do is come up with an approximation of what the curve looks like by projecting along the slope from the starting point.

The program above demonstrates how it's done. This approach is called Euler's Method, and is gives a numerical approximation rather than finding the exact, analytical solution using calculus (integration).

So why use an approximation when you can find the exact solution? Because, there are quite a number of problems that are impossible or extremely difficult to solve analytically, things like: the diffusion of pollution in a lake; how changing temperature in the atmosphere gives you weather and climate; the flow of groundwater in aquifers; stresses on structural members of buildings; and the list goes on and on.

As with most types of numerical approximations, you get better results if you can reduce the step size between projections of the slope. Try changing the numbers and see.

A more detailed version, with solutions, is here: Euler's Method.

A good reference: Euler's Method by Paul Dawkins.

Citing this post: Urbano, L., 2012. Euler's Method for Approximating a Solution to a Differential Equation, Retrieved May 30th, 2017, from Montessori Muddle: http://MontessoriMuddle.org/ .
Attribution (Curator's Code ): Via: Montessori Muddle; Hat tip: Montessori Muddle.

Slope Fields

February 27, 2012

Your browser does not support the canvas element.

Say you have the equation that gives you the slope of a curve (let \frac{dy}{dx} ) be the slope):
 \frac{dy}{dx} = \frac{1}{2} x + 1
When you use integration to solve the equation, there are quite the number of possible solutions (infinite actually), because when you integrate:
 y = \int (\frac{1}{2} x + 1 ) dx
you get:
 y = \frac{1}{4} x^2 + x + c
where c is a constant. Unfortunately, you don't know what c is without more information; it could be anything.

However, even without integrating, we can get a feel for what the curve will look like by plotting what the slope will look like at a bunch of different points in space. This comes in really handy when you end up with a equation for slope that is really hard -- or even impossible -- to solve.

The graph below show a curve of possible solutions to the slope equation. You should be able to see, as the graph slowly moves up and down, how the slope of the graph corresponds to the slope field.

Your browser does not support the canvas element.

Citing this post: Urbano, L., 2012. Slope Fields, Retrieved May 30th, 2017, from Montessori Muddle: http://MontessoriMuddle.org/ .
Attribution (Curator's Code ): Via: Montessori Muddle; Hat tip: Montessori Muddle.

Numerical Integration

February 23, 2012

Your browser does not support the canvas element.

This is an attempt to illustrate numerical integration by animating an HTML5's canvas.

We're trying to find the area between x = 1 and x = 5, beneath the parabola:

y = -\frac{1}{4} x^2 + x + 4

By integrating, the area under the curve can be calculated as being 17 ⅔ (see below for the analytical solution). For numerical integration, however, the area under the curve is filled with trapezoids and the total area is calculated from the sum of all the areas. As you increase the number of trapezoids, the approximation becomes more accurate. The reduction in the error can be seen on the graph: with 1 trapezoid there is a large gap between the shaded area and the curve; more trapezoids fill in the gap better and better.

The table below show how the error (defined as the difference between the calculation using trapezoids and the analytic solution) gets smaller with increasing numbers of trapezoids (n).

Number of trapezoids Area (units2) Error (difference from 17.66)
1 15.00 2.66
2 17.00 0.66
3 17.37 0.29
4 17.50 0.16
5 17.56 0.10
6 17.59 0.07
7 17.61 0.05
8 17.63 0.03
9 17.63 0.03
10 17.64 0.02

Analytic solution

The area under the curve, between x = 1 and x = 5 can be figured out analytically by integrating between these limits.

Area = \int_{_1}^{^5} \left(-\frac{x^2}{4}  + x + 4 \right) \,dx

Area = \left[-\frac{x^3}{12}  + \frac{x^2}{2} + 4x \right]_1^5

Area = \left[-\frac{(5)^3}{12}  + \frac{(5)^2}{2} + 4(5) \right] - \left[-\frac{(1)^3}{12}  + \frac{(1)^2}{2} + 4(1) \right]

Area = \left[-\frac{125}{12}  + \frac{25}{2} + 16 \right] - \left[-\frac{1}{12}  + \frac{1}{2} + 4 \right]

Area = \left[ 22 \frac{1}{12} \right]  - \left[4 \frac{5}{12} \right]

Area = 17 \frac{2}{3}  = 17.6\bar{6}

(See also WolframAlpha's solution).

Update

Demonstration of this numerical integration using four trapezoids in embeddable graphs.

Citing this post: Urbano, L., 2012. Numerical Integration, Retrieved May 30th, 2017, from Montessori Muddle: http://MontessoriMuddle.org/ .
Attribution (Curator's Code ): Via: Montessori Muddle; Hat tip: Montessori Muddle.

Creative Commons License
Montessori Muddle by Montessori Muddle is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 United States License.