Showing posts with label circle. Show all posts
Showing posts with label circle. Show all posts

Wednesday, July 15, 2015

How to Program a Circle in Scratch - Part 4

   In Part 3 of this series we ended with a Scratch script that draws a generalized polygon and then sends the ant sprite to the center of the polygon. Along the way we found an expression for the radius in terms of the (length of side) and (number of sides) variables and developed the expression for turning the ant sprite so that it points along a radius. Then the script sent the ant sprite to the center of the polygon. But why not start at the center of the regular polygon? All we need to do is write the G-polyFTC.sb2 script backwards! Build the following code and check that it does indeed work backwards.
   In the above script, all of the action is still controlled by the variables (number of sides) and (length of side). That is, we are still working with the polygon concept where the number of sides variable is large enough to create the illusion of a circle.
   But the goal is to create a Scratch Circle (center, radius) script. The question now is, can we replace the (number of sides) and (length of side) sliders with a single, radius slider?

   To answer the question, let's revisit the math.

   We argued that the perimeter of a regular polygon P is equal to the (number of sides) multiplied by the (length of each side). We agreed that for a large number of sides, the regular polygon cannot be distinguished from a circle. In equation form,

P = 2πr
(length of side)(number of sides) = 2πr.
    We solved this expression algebraically for the radius r, to express the relationship as

radius = r =(length of side)(number of sides)/2π

   The G-poly script for drawing the regular polygon is working well, so let's keep it. At the screen resolution available on most computers, a regular polygon with sixty sides is very close to a true circle. 
   So, to get rid of the (number of sides) slider, let's set the (number of sides) to 60. We can now delete the (number of sides) variable and replace its every occurrence in the script with the number 60 because a polygon with 60 sides is indistinguishable from a circle.
   Since we’ve set the (number of sides) to 60 we can now express the (length of side) variable in terms of the radius. Here comes more algebraic thinking in the form of symbol manipulation.  The equations are,
60(length of side) = 2πr.
(length of side) = 2πr/60
   The (length of side) variable is now expressed in terms of r, the radius. Create a new variable named radius, make it a slider, and then use the radius value set by the slider in the (length of side) variable. Now, when the desired radius is set, the (length of side) variable is adjusted so that it draws the 60-sided polygon with the desired radius with the ant sprite stopping at the point it started from to close the polygon.
   The Scratch script shown on the next page has made these adjustments to the code at the top of page one of this post.
   Here is a cleaner version of the code.
   Success! Below is a Scratch circle centered at (0, 0) with a radius of 100 units created by the above script.
   There's one short hop to the Scratch program, Circle (center, radius, arc) that draws  the arc of a circle, from 1º to 360º when given the center and radius. That's the topic for the last post in this series.
   A free version of this post as a pdf file is available on request by emailing

Thursday, July 9, 2015

How to Program a Circle in Scratch - Part 3

   Scratch does not have a block that will draw a circle or arc of a circle if given the center (x, y) and the radius. The problem is not a small problem so we will do what problem-solvers often do and that is to break the problem into a series of smaller problems.

   To begin, you should have written a generalized polygon script that generates any regular polygon with n sides of side length m. If you haven’t completed this step, go back and read the How to Program a Circle in Scratch - Part 2 post at At the conclusion of  of this post you had written and tested a general polygon script called G-poly.sb2.

   When playing with G-poly it's hard to miss the fact that as the number of sides increases, the polygon approaches the shape of a circle.  We will make use of this fact in our effort to write a script that draws a circle or arc of a given radius but first, it will help to review a few basic properties of regular polygons.

    From the list of polygon properties you will notice that the center of a regular polygon is defined as the common center of the inscribed and circumscribed circle. The radius of a regular polygon is also defined. It’s the line joining any vertex with the center. Note that every vertex of any regular polygon lies on the circumscribed circle.
   An important property of G-poly is that it doesn’t draw over any previously drawn sides. In other words, no matter what settings appear in the slider windows, the algorithm always closes the polygon and stops at the point it started!
   Consider the case where G-poly has drawn a regular pentagon and the ant sprite has returned to its starting point as shown in the following figure. To get to the center of the polygon, the ant sprite first has to turn through the angle indicated by x and move along the radius drawn in red.

   Angle x is found by applying the properties of a regular polygon. In a regular polygon, the central angle is found by dividing 360º by the number of sides, n. Since all radii of the same regular polygon are equal, the triangle formed by the central angle and the enclosed side is isosceles. The base angles (x) of an isosceles triangle are equal. The angle sum of a triangle equals 360º. Solve for x.
   We now know the turn angle, x, that directs the sprite towards the center of the regular polygon. The next step is to find the length of the radius.
   The number of sides of a regular polygon do not have to be large for the screen resolution to hide the fact that the shape drawn to the screen is an n-sided polygon and not a circle. From this point on, assume the number of sides given as input to G-poly is large enough to make the G-poly polygon indistinguishable from a circle.
   In respect to a regular polygon with a large number of sides, a mathematician would say, “As the number of sides n approaches and the length of each side m approaches 0, the perimeter P of the polygon approaches C, where C is the circumference of a circle.”      If the screen resolution makes a polygon with a relatively small number of sides look like a circle, then the perimeter P of the polygon can be substituted for C, the circumference of the circumscribed circle. In fact, from here on in this discussion, 'circle' means a regular polygon indistinguishable from a true circle.

   To get G-poly to the center of the polygon, we can take advantage of the fact that for all practical purposes, the perimeter of the polygon closely approximates the circumference of the circumscribed circle!
Circumference ≈ Perimeter
   The circumference of a circle is equal to 2πr where r is the radius. Therefore, we can set the perimeter of the polygon to also equal 2πr.
 P = 2πr
   The perimeter of a regular polygon is the product of the length of a side and the number of sides.
   Now we express this relationship algebraically by expressing the relationship in terms of the radius.
radius = (length of side)(number of sides)/2π
   The radius can therefore be implemented in Scratch by using this block.

   Now that we’ve done the math, the algorithm becomes clear. Use G-poly to draw the polygon as shown in the graphic. With the ant sprite back at its starting point the sprite turns right xº, and moves the length of the radius to the center. Let’s name this script G-poly FTC for G-poly Finds the Center.

   Here is a screen shot of a 40-sided polygon with a side length of 24 units drawn by G-polyFTC. The ant sprite then moves to the center.

Wednesday, July 1, 2015

How to Program a Circle in Scratch - Part 1

   Scratch does not have a circle block. For example, there is not a block that lets you define where to place the center of a circle, and with what radius, that will draw a circle or perhaps the length of arc of a circle you would like Scratch to draw. But, with a bit of circle geometry and a dash of simple coding, it’s easy to build such a block. But it takes a series of short, easy to make jumps, not a long leap to get to such a block. So, let’s make the first jump, into the problem and, through a series of posts, we will soon enough complete the long jump.
   Scratch may not have a circle block but it does have a [move ____steps] block and a [turn (rt) ____degrees] block. These two blocks make it is easy to draw a regular polygon with Scratch. This code creates an 18-sided polygon that starts and stops at (0, 0).
   A regular polygon with 18 sides is not far from looking circular. The red-shaded portion in this graphic shows how small the difference is.

   The number of sides of a regular polygon does not have to be too large for it to look very much like a circle. A regular polygon with 36 sides can hardly be seen as anything but a circle as can be seen in the following graphic where Scratch has drawn a regular polygon with 36 sides.
   To draw a circle we can first draw a regular polygon with a sufficient number of sides to make the polygon approach a circle to the point that there is essentially no difference between the two. Then, if the program can set the radius, we can draw a circle of any size at a given point! Therefore, my next post will go through, step-by-step, how to program a generalized regular polygon script in Scratch.This is the first hop so remember it will take three or four hops to complete the leap.