In calculus, one of the central problems is finding the exact area under a curve:
$$A = \int_a^b f(x)\,dx$$
Before calculus, mathematicians approximated areas by slicing curves into simple geometric shapes. The German mathematician Bernhard Riemann formalized this in 1854:
Divide the interval $[a, b]$ into $N$ equal strips of width $\Delta x = \frac{b - a}{N}$.
Over each strip, build a rectangle whose height equals the function value $f(x^*)$ at a sample point inside the strip.
Add the areas of all $N$ rectangles together:
$$\text{Area} \approx \sum_{k=0}^{N-1} f(x_k^*) \cdot \Delta x$$
As $N$ grows ($2, 4, 8, 16, 32, \dots$), the jagged staircase of rectangles melts into the smooth curve. In the limit as $N \to \infty$, the Riemann sum becomes the exact definite integral!
In this lesson, we use the GIF animator with solid filled shapes (gif_fillrect(x1, y1, x2, y2, color)), lines (gif_line(x1, y1, x2, y2, color)), pixel plotting (gif_pset(x, y, color)), and frames (gif_add_frame(delay)) to watch this mathematical convergence happen right before our eyes!
gif_fillrect(x1,y1,x2,y2,color)
Move the mouse over a dotted box for more information.
Now you try. Change the function to an upside-down parabola like 80 - (px*px)/180, or compare left endpoints with right endpoints!
Type your code here:
See your results here:
The code has ???? for exact_area. Replace ???? with 3840 (the calculus integral) to compare Riemann approximations against the exact area in the animation!
Notes:
gif_fillrect(x1, y1, x2, y2, color) paints a solid block between $(x_1, y_1)$ and $(x_2, y_2)$.
gif_rect(x1, y1, x2, y2, color) draws a 1-pixel hollow rectangle outline.
The exact calculus integral is $\int_0^{120} \frac{x^2}{150}\,dx = \left[ \frac{x^3}{450} \right]_0^{120} = \frac{1,728,000}{450} = 3840.00$. Notice how error drops rapidly as $N$ increases!
Share your code
Show a friend, family member, or teacher what you've done!