CenterText 10, "Steve's Basic SIN/COS Demo/Tutorial for Programming"
PRINT "First, let's go over what SIN and COS actually are. A lot of people are completely mystified by" PRINT "these two basic math commands." PRINT "SIN and COS are nothing more than than a RATIO of the sides of a right triangle" PRINT "For example, take a look at the triangle below" LINE (0, 250)-(200, 250), _RGB32(0, 255, 0) 'Green LINE (200, 250)-(200, 150), _RGB32(0, 0, 255) 'Blue
LOCATE 13, 40:
PRINT "The GREEN Line is Adjacent to our angle" LOCATE 15, 40:
PRINT "The BLUE Line is Opposite from our angle"
PRINT "If we look at the triangle above, we want to use the angle from the far left corner to get our SIN" PRINT "SINE (SIN) is basically nothing more than the ratio of the length of the side that is opposite that" PRINT "angle to the length of the longest side of the triangle (the Hypotenuse)." PRINT "Now, that might sound like a complex mouthful, but it's not as complicated as it seems." PRINT "Basically, in the image above, if we were to measure the length of the BLUE line and then DIVIDE it" PRINT "By the length of the RED line, we'd have the SINE value of our angle." PRINT "Opposite/ Hypotenuse = SINE (or in this case, length of BLUE / length of RED = SINE)" PRINT "Now, image taking this triangle and making it bigger or larger. DON'T change the angle, but expand" PRINT "the length and height of it in your imagination." PRINT "No matter how large you scale it, the RATIO of that opposite side and hypotenuse is ALWAYS going to" PRINT "That RATIO of opposite side divided by hypotenuse IS what SINE (SIN) is." PRINT "And COSINE (COS) is nothing more than the ratio of the ADJACENT side divided by the hypotenuse." PRINT "Which, in the above triangle would be nothing more than the length of the GREEN line, divied by" PRINT "the length of the RED line." PRINT "That RATIO of adjacent side divided by hypotenuse IS what COSINE (COS) is." PRINT "No matter how much you scale that triangle, that RATIO between those sides is going to stay the same" PRINT "Now, let's say that my triangle has sides which are 3, 4, and 5 (units) long. (If you're American," PRINT "they can be inches. Elsewhere, centimeters...)." PRINT "Now, obviously looking at my (not to scale) triangle above, the Opposite side would have to be the" PRINT "shortest at a length of 3. The Adjacent side would have to be a little longer at a length of 4." PRINT "And the Hypotenuse would be the longest side with the height of 5)" PRINT "(Red Line = 5, Green Line = 3, Blue Line = 4 on the diagram above)" PRINT "So what would our SIN and COS be for the above triangle (with the imaginary figures provided)?" PRINT "SIN = Opposite / Hypotenuse, so that's 3/5 in this case (.6)" PRINT "COS = Adjacent / Hypotenuse, so that's 4/5 in this case (.8)" PRINT "And if we take a protractor (remember those from school?), we can measure the angle (for that" PRINT "imaginary triangle), and see that it is roughly 36.87 degrees." PRINT "So, if we use the computer to check our math, this is what it tells us:" PRINT "As you can see, our numbers aren't an EXACT match, but that's because I didn't use an EXACT figure" PRINT "for that angle. The angle formed by a 3-4-5 triangle is actually closer to 36.86989764582773" PRINT "degrees, but who's counting that close? (Except for the computer?) :P" CenterText 1250, "Press the <<RIGHT ARROW>> to go on to PART II: Using SIN/COS In Triangles"
CenterText 1320, "PART II: Usine SIN/COS in triangles"
PRINT "To briefly recap:" PRINT "SIN(angle) = Opposite / Hypotenuse" PRINT "COS(angle) = Adjacent / Hypotenuse" PRINT "Which all sounds good and such. We now know HOW we get sine and cosine from an angle, but how" PRINT "the heck do we make use of it?" PRINT "First, let's look at a basic right triangle again. (A right triangle is defined as having one" PRINT "side which is 90 degrees, as illustrated again below.)" LINE (400, 1550)-(300, 1650) LINE (300, 1650)-(400, 1650) LINE (400, 1550)-(400, 1650) PRINT "As you can see, the angle at Point C is 90 degrees, so this is indeed a right triangle." PRINT "(I'd hate to work with wrong ones. Last I heard, they got several years jail time!)" PRINT "So given two pieces of information for this triangle, can you figure out the rest?" PRINT "For example, let's pretend that this is a triangle with the longest side (hyptoenuse) being" PRINT "200 units long, and our angle at point B is 45 degrees." PRINT "What would the length of the other 2 sides be?" PRINT "Now, even though we all hate word problems, let's take a look at this one before we give up." PRINT "First, what's the side opposite of our given angle?" PRINT "(Looking at the illustration above, it'd be the line from A to C, correct?)" PRINT "Open up your calculator, and get ready to do some math! (Or else you'll never learn...)" PRINT "Remember what we said about what SINE and COSINE was?" PRINT "SIN(angle) = Opposite / Hypotenuse" PRINT "COS(angle) = Adjacent / Hypotenuse" PRINT "So to find that side opposite our given angle, we'd need to multiple both sides by the" PRINT "Hypotenuse, so that we'd end up with basically the following:" PRINT "SIN(angle) * Hypotenuse = Opposite" PRINT "COS(angle) * Hypotenuse = Adjacent" PRINT "Remember why this works? Think of our formula with actual numbers:" PRINT "6 = x / 2 <-- let's pretend this is our formula." PRINT "Now, if we multiply each side by 2, we'd end up getting:" PRINT " 6 * 2 = x / 2 * 2" PRINT "When you divide by a number and multiply by the same number, you get 1..." PRINT "Which simplifies down to: 6 * 2 = x (or our answer of 12 in this case)" PRINT "In this case, we can just plug in the 2 numbers we know and get the last one." PRINT "Our angle is 45 degrees." PRINT "Our Hypotenuse is 100 units in length." PRINT "What would the length of the opposite side be? See if you can figure it out with what we've went" PRINT "SIN(angle) * Hypotenuse = Opposite" PRINT "SIN(45) * 100 = Opposite" PRINT "COS(angle) * Hypotenuse = Adjacent" PRINT "COS(45) * 100 = Adjacent" PRINT "Does the numbers you have look similar to the ones above?" PRINT "Seems simple enough, but think of what we've just did..." PRINT "We took nothing more than a given angle and a side, and calculated the other sides of our triangle!" PRINT "CONGRATULATIONS!! You're well on the way to understanding SIN and COS." PRINT "It's really not as complicated as some folks like to make it seem. It's basically just" PRINT "a relationship between 3 things, and using 2 of those things to figure out the third..." CenterText 2770, "Press the <<RIGHT ARROW>> to go on to PART III: Using SIN/COS For Circles and Arcs"
CenterText 2820, "PART III: Using SIN/COS for Circles and Arcs"
PRINT "Now that we've discussed the basics about how we can use SIN and COS in triangles, just how the heck" PRINT "do we make them useful for circles?" PRINT "This is a standard QB64 circle." PRINT "The command to make this is:" PRINT "CIRCLE (x,y), radius, color" PRINT "Using the information above, we know a heck of a lot of information about this circle." PRINT "If you look at the source code for this program, you'll see our circle command is:" PRINT "CIRCLE (400,3000), 100, _RGB32(255,255,0)" PRINT "Which breaks down to the center being at the point 400,3000, the radius being 100 pixels, and the" PRINT "color being yellow." PRINT "But could we draw this circle manually, using SIN and COS?" PRINT "Think back on our previous lesson..." PRINT "We take an angle and a side, and we calculate the length of the other 2 sides." PRINT "To make a circle, we basically make a 360 degree arc, correct?" PRINT "So this would give us a nice loop so we can plot a pixel at each degree:" PRINT "FOR angle = 1 to 360" PRINT "And we know what our radius would be, correct? (It was 100, if you remember...)" PRINT "And using what we learned previously, what would the length of the opposite and adjacent sides" PRINT "of a triangle be with 45 degrees and a 100 unit hypotenuse??" PRINT "SIN(angle) * Hypotenuse = Opposite" PRINT "COS(angle) * Hypotenuse = Adjacent" PRINT "And how does this pertain to our CIRCLE, you ask...." PRINT "As you can see, we have a 45" PRINT "degree angle in this circle," PRINT "as illustrated here." PRINT "Now, for Angle A, with Radius R" PRINT "What is the length of the other" PRINT "SIN(angle) * Hypotenuse = Opposite" PRINT "COS(angle) * Hypotenuse = Adjacent" PRINT "So, let's plug in what we know to these 2 sets of equations:" PRINT "x is ADJACENT to our angle A." PRINT "y is OPPOSITE to our angle A." PRINT "Our Hypotenuse is 100 pixels in size. (R)" PRINT "The angle A that we're using here is 45 degrees" PRINT "SIN(45) * 100 = Opposite (or y in this case)" PRINT "COS(45) * 100 = Adjacent (or x in this case)" PRINT "And what does this tell us about this single point on our circle??" PRINT "That when we have a radius of 100 pixels, the point at 45 degrees is going to be 70 pixels above" PRINT "and 70 pixels right of the center!" PRINT "But this just gives us a single point on the circle, for where 45 degrees would be..." PRINT "But never fear! We can apply the exact same logic and math to get ANY point on our circle!!" PRINT "Try it out yourself, in your head. Change that angle to 30 degrees. The radius is going to stay" PRINT "the same, as it's consistent with a circle (or else you don't have a circle), but using the" PRINT "above method, we can find ANY point on our circle..." PRINT "So to do a complete circle, we might code the following:" PRINT "FOR angle = 1 to 360 '1 point on the circle for each degree" PRINT " x = SIN(_D2R(angle)) * Radius 'we have to convert degree to radian for computer math, thus _D2R" PRINT " y = COS(_D2R(angle)) * Radius" PRINT "And we don't make a circle!!" PRINT "ARGH!! Why the heck is he teaching us how to NOT make a circle?" PRINT "WHY didn't that make a circle??"
clip$
= "SCREEN 12" + CHR$(10) + "COLOR 4" + CHR$(10) + "Radius = 50" + CHR$(10)clip$
= clip$
+ "FOR angle = 1 TO 360 '1 point on the circle for each degree" + CHR$(10)clip$
= clip$
+ "x = SIN(_D2R(angle)) * Radius 'we have to convert degree to radian for computer math, thus _D2R" + CHR$(10)clip$
= clip$
+ "y = COS(_D2R(angle)) * Radius" + CHR$(10)clip$
= clip$
+ "PSET (x, y)" + CHR$(10)clip$ = clip$ + "NEXT"
PRINT "If you're using a Windows machine to run this, open a second version of QB64 and test it out" PRINT "I've made the process as simple as possible: Just open a new QB64 window, hit Ctrl-V to paste" PRINT "and then compile and run. I've already loaded your clipboard with a sample program all set to run!" PRINT "For you Linux folks (whom clipboard support doesn't work fully for yet with GL), or for those" PRINT "who don't want to test the results themselves..." PRINT "The reason this fails is simple:" PRINT "We just calculated our circle, but forgot to plot it RELATIVE TO THE CENTER!" PRINT "x and y were how far right and up we had to go from the CENTER to draw our circle (or arc for a" PRINT "partial segment) -- and we didn't calculate for that." PRINT "What we'd want to do is change the PSET line to include that center coordinate." PRINT "Something like this should work: PSET (Xcenter + x, Ycenter + y)" PRINT "Then we just set that Xcenter and YCenter to wherever we want the center point of our circle to be" PRINT "and we can draw it onto our screen!" PRINT "Now, that wasn't TOO terrible was it?" PRINT "I feel like I've rushed part of this, and have skipped over several things that would potentially be" PRINT "very useful to people in the long run (like Opposite ^ 2 + Adjacent ^ 2 = Hypotenuse ^ 2), but I" PRINT "wanted to toss together the very basics of SIN/COS, what they are, and how we use them for a circle" PRINT "in our programming." PRINT "I'm still going to be busy for the next few weeks, but I hope this helps people get a start on" PRINT "learning what these commands are, and how they relate to our circles for us." PRINT "Keep an eye open, and once my time frees up once more, I'll expand this even more and try and add" PRINT "some interactive demostrations for everyone to play around with." PRINT "Like most projects, I don't know if it'll ever get finished." PRINT "Look for the next update...."
y = 0: Part = 1
Button = MouseClick: MK = 0
CASE 1: k
= 19712: MK
= -1 CASE 2: k
= 19200: MK
= -1 CASE 4: k
= 18432: MK
= -1 CASE 5: k
= 20480: MK
= -1 CASE 20480: y
= y
+ Scroll:
IF y
> 700 THEN y
= 700 CASE 19712: Part
= 2: y
= 1300 CASE 18432: y
= y
- Scroll:
IF y
< 1300 THEN y
= 1300 CASE 20480: y
= y
+ Scroll:
IF y
> 2200 THEN y
= 2200 CASE 19712: Part
= 3: y
= 2800 CASE 19200: Part
= 1: y
= 0 CASE 18432: y
= y
- Scroll:
IF y
< 2800 THEN y
= 2800 CASE 20480: y
= y
+ Scroll:
IF y
> 5000 THEN y
= 5000 CASE 19200: Part
= 2: y
= 1300
SUB CenterText
(y
, text$
) x = (w - l) \ 2
scroll%
= scroll%
+ _MOUSEWHEEL ' if scrollwheel changes, watch the change here speedup = 1
speedup = 2
speedup = 3
IF speedup
THEN 'buton was pushed down mouseclickxxx1%
= _MOUSEX: mouseclickyyy1%
= _MOUSEY 'see where button was pushed down at LOOP 'finishes when button is let up IF mouseclickxxx1%
>= _MOUSEX - 2 AND mouseclickxxx1%
<= _MOUSEX + 2 AND mouseclickyyy1%
>= _MOUSEY - 2 AND mouseclickyyy1%
<= _MOUSEY + 2 THEN 'if mouse hasn't moved (ie clicked down, dragged somewhere, then released) MouseClick% = speedup
MouseClick% = 0
IF scroll%
< 0 THEN MouseClick%
= 4 IF scroll%
> 0 THEN MouseClick%
= 5