At My Fingertips
Rapid Playground
Here is the kind of plot you will be able to create by the end of this activity:
In this activity we will work with the parametric_plot
function.
This functions produces a plot consisting of a bunch of dots.
The function takes a sequence of numbers,
like [0, 10, 20, 100]
,
and produces a dot for each number.
The position of the dot is determined by the number,
and by two functions:
The parametric_plot
function in this activity has three mandatory parameters:
p_to_x
expects a function used to map a number to an x-coordinatep_to_y
expects a function used to map a number to a y-coordinateps
expects the sequence of numbersYou can see four dots: one for each value in the list:
p | x | y |
---|---|---|
0 | 0 | 0 |
10 | 20 | -10 |
20 | 40 | -20 |
100 | 200 | -100 |
The x and y coordinates of the dots are determined by the given functions.
The above plot isn't too exciting. We really would want to see more than just four dots! In Python, luckily we don't need to manually write down the list of numbers to use. Instead, we can use the range function to produce as long a sequence of numbers as we wish.
The parametric_plot
function has an optional parameter to specify what color the points are drawn in.
Let's define some more functions to play with,
in addition to the above fx
and fy
.
identity
The identity
function is rather dumb.
But it comes in handy if you need a function that just passes values through.
Now let's create a plot using the identity function to determine x and y.
constant0
Let's create another special function: constant0
.
That function will always return the value 0,
no matter what argument value it receives.
constant100
Let's check whether you were right!
Use the identity
and the constant100
function you just implemented to create such a plot.
We use identity
as the first argument, which means the x-coordinates
will correspond to the parameter values.
Hint: Do not call the function. Just pass it along. That means: don't write constant100(...)
.
Yes, you should see the points arranged in a horizontal line, located at y=100.
In addition to the color, the parametric_plot
function also has an optional parameter to specify the line width.
See how the width is specified in the units of the plot? The dots have a diameter of 20. The centers of our dots are located at y=100. If we set the line width to 200, the bottom of the dots will touch the horizontal axis (y=0).
The last optional parameter of the parametric_plot
function
allows you to scale the plot.
The default scale factor is 1.0.
To "zoom out", use a value larger than 1.
To "zoom in" use a value between 1 and 0.
So far we defined five functions:
Function | Definition |
---|---|
fx | fx(p) = 2p |
fy | fy(p) = -p |
identity | identity(p) = p |
constant0 | constant0(p) = 0 |
constant100 | constant100(p) = 100 |
When we use them in parametric_plot
, the dots get arranged in straight lines.
Why? Because all the above functions are affine (they fit the form f(x) = ax + b).
sqrt
The square root is another function we could use. It's not affine, so we should see some "curvy" action!
The sqrt function from Python's math library
returns the square root of the parameter value it receives.
The above plot shows the function for the interval between 0 and 100.
Because sqrt(100)
is small (it's 10), we zoom in a bit (by a factor of 6)
to better see the curve.
sin
One of the coolest functions out there is sin. Let's look at it, for the interval 0 to 2 * pi.
For this, we use identity
to determine the x-coordinate,
sin
to determine the y-coordinate,
and parameter values between 0 and 2 * pi.
Because Python's built-in range function
only works for integer numbers,
and we would like to produce a range of numbers between 0 and 6.283...,
we use the float_range
function we can import from our plot
module.
Given that sin produces values between -1 and 1, and the x-axis will go from 0 to 2 * pi (6.283...), we want to zoom in quite a bit to see the curve. Here we use a scale factor of 100. Moreover, we set the dot width to 0.1, so the dots are 5% of the height of the whole curve (0.1 in an interval of -1 to 1).
You should see about 60 points. Why?
Because we ask float_range
to produce a range of numbers,
starting at 0, and stepping by pi / 30
,
until just before it reaches 2 * pi
.
The value 2 * pi
itself is excluded,
thus the last number should be 2 * pi - pi / 30
.
However, due to tiny rounding errors,
summing up 60 times the step value of pi / 30
may lead to a number that is not exactly 2 * pi
,
but a tiny bit smaller.
If that happens, that number will still be included in the sequence
(as the 61st element).
So far we used identity
for determining the x-coordinate.
How about flipping things around, and using identity
to determine the y-coordinate
while determining the x-coordinate using more interesting functions?
First, let's again use identity
for both coordinates.
sin
Now let's use sin for the y-coordinate:
Now let's unlock the secret power of parametric plots:
you don't need to use the boring identity
function at all!
Let's use a more interesting function for both coordinates.
If we use the same function to determine the x-coordinate as we do to determine the y-coordinate, then for each points x will equal to y. This means that the points will all lie on the diagonal.
If we use different functions for x and y, we get more interesting plots.
Specifically, if we plot sin
against cos
, we get... the unit circle
(the circle with radius 1, centered at the origin)!
Because it's hard to see a circle with a radius 1, we scale up the plot by a factor of 100.
With only 60 points (2 * 30), our circle looks rather spotty. Let's use more points by replacing the 30 in the above code by a larger number. If you pick a large enough number, the circle will look like a real circle, made of a continuous line, with the given line thickness (0.1) and color (red).
The parametric_plot
function allows you to specify a fixed line with and a fixed color.
This is not sufficient for creating the graphic you saw at the top of this activity.
To create that graphic, we need to be able to not just vary the x and y coordinates, but also the color and the line thickness!
We can use the parametric_color_thickness_plot
function for this.
Create your own functions and use them to determine x, y, color, and line thickness.
For example, try functions that call sin(k * p)
for some constant k
(similar to wavy
and beads
).
Play and have fun!
In this activity you learned about parametric plots. They are great to visualize parametric equations.
In terms of programming, you learned to define your own functions,
and you learned to pass functions (your own, or existing ones like sin) to other functions (like parametric_plot
).
Passing functions around, like you pass any other value,
is the cornerstone of functional programming.
Functions (like parametric_plot
) that play with other functions
are called higher-order functions.
You find various higher-order functions in mathematics:
the composition operator (f ∘ g) used to compose two functions,
or the differential operator (d/dx) for producing the derivative of a function,
or the integral operator (∫) for producing the integral of a function.
If you write pure functions in Python (functions that receive values only through their parameters, and that just return a value but have no other effects), then programming in Python (or any other programming language) is pretty much the same as doing algebra.
This activity has been created by LuCE Research Lab and is licensed under CC BY-SA 4.0.
Parametric Plot
PyTamaro is a project created by the Lugano Computing Education Research Lab at the Software Institute of USI
Privacy Policy • Platform Version e1c4550 (Sun, 23 Feb 2025 15:42:54 GMT)