Scratch Part 12: Graphics

We can make a sprite leave a trail by using the pen down command in the Pen area.

Lines

Drawing a straight line is easy in Scratch. To draw a line in the y direction you need to change the x value. And vice versa.

We can now draw geometric shapes such as squares and hexagons (just like turtle graphics in Logo).

Waves

We can make lines more interesting by introducing some change in the x or y values. Here is a sine wave:

This works for cosine as well.

Task: Plot Sine and Cosine on the same graph. Try changing the amplitude of the waves.

Parabola

Now for a parabola. Here we say something like y=x^2. So we need to change the y value by the square of the current x value. If we start at -100 and go to +100 on the x axis we will have very large values so we need to scale them. -100^2 = 10,000 but the graphics area in Scratch is -240-240 and -180-180 so we need to scale the result.

The parabola can be drawn as a 'U' or a ''.

Task: Use the parabola equations to create a game that involves throwing a ball into a net (basketball).

Triangles

How do we draw a triangle?

An equilateral triangle is easy as we know the angles:

Note the angle of turn: what formula is used to calculate this?

What about a right angle triangle?

If we move 100, turn 90, move 50 and then turn - but turn what angle? How do we know what angle to turn in order to get back to where we started and complete the triangle? And how far would we need to move in order to reach the starting point? We need to solve the triangle.

We have drawn the opposite and the adjacent sides of the triangle and now we need the angle and the hypotenuse.

We can calculate the hypotenuse using Pythagoras: h = square root(100 x 100) + (50 x 50) (substitute any other numbers according to lengths). This is 111.8.

We can now calculate the angle with sin (angle) = O/H - but we don't know the angle! So we use arcsin(O/H) or arcsin(100/111.8) = arcsin(0.89). In a many situations (such as a spreadsheet) this result would be in radians and we would have to multiply by 180/PI or 57.3 to convert to degrees but in Scratch this is already done for us. Thus arcsin(100/111.8) returns 63.4. The sprite needs to turn 180 minus this angle, which is 116.6. We can then complete the triangle:

We could use variables for the first two sides of the triangle so the code would draw any right angle triangle.

We could use other trig functions to calculate the lengths and angles of triangles in other situations.

Circles

We can draw a circle using sine and cosine. Here are some values for sin(x) and cos(x):

x sin(x) cos(x) sin(x) * 100 cos(x) * 100
0.1 0.1 1 9.98 99.5
0.2 0.2 0.98 19.87 98.01
0.3 0.3 0.96 29.55 95.53
0.4 0.39 0.92 38.94 92.11
0.5 0.48 0.88 47.94 87.76
0.6 0.56 0.83 56.46 82.53
0.7 0.64 0.76 64.42 76.48
0.8 0.72 0.7 71.74 69.67
0.9 0.78 0.62 78.33 62.16
1 0.84 0.54 84.15 54.03
1.1 0.89 0.45 89.12 45.36
1.2 0.93 0.36 93.2 36.24
1.3 0.96 0.27 96.36 26.75
1.4 0.99 0.17 98.54 17
1.5 1 0.07 99.75 7.07

If we plot the values in the two right-most columns on the x and y axes of a graph we get part of a circle: the values in the left column (x axis) increase from around 10 to 100 while those in the second column (y axis) decrease from around 100 to around 10 - this plots the curve of a circle.

Task 15: Parabola

Make a game that involves firing a shell over a barrier to land on suitable targets.