Understanding sin, cos

Programming Questions

rremus89

in Programming Questions • 9 months ago

I'm new to processing (in Java not) and I don't understand how to calculate sin. I saw different examples for how to draw a polygon with line (not vertex), but I don't understand it. This example below is made by me with lines no calculations (sin, cos), I only added the line parameters. So... how to calculate sin? According to what? According to oX, oY? How am I supposed to draw ONLY the red line?

private static final Integer SIZE = 100; // constant
translate(width/2, height/2); //center
stroke(255,0,0); // red color
line( sin( ??? ) + SIZE, cos( ???? ) + SIZE.... // I don't get it

Replies(2)

PhiLho

Re: Understanding sin, cos

9 months ago

I am not too sure what you ask for. Nor how well you understand how these functions work.
Just in case, I point to Trigonometry Primer I article in the Learning section, and a visit to Wikipedia, for example, might be useful too.

PhiLho

Re: Understanding sin, cos

9 months ago

Here is an example implementing your drawing:

// Use int intead of Integer (useless wrapper here).
// private static aren't useful in a sketch. final is still useful, though.
// Actually, Processing 2.0b7 rejects private and static! (I think it worked before)
final int SIZE = 100;
final float ANGLE = radians(85.0);
size(500, 500);
background(0);
translate(width/2, height/2); //center
rotate(-HALF_PI); // Change the coordinate system to follow your drawing
stroke(255); // White color
float posRightX = SIZE * cos(ANGLE / 2);
float posRightY = SIZE * sin(ANGLE / 2);
line(0, 0, posRightX, posRightY);
float posLeftX = SIZE * cos(-ANGLE / 2);
float posLeftY = SIZE * sin(-ANGLE / 2);
line(0, 0, posLeftX, posLeftY);
stroke(255, 0, 0); // red color
line(posLeftX, posLeftY, posRightX, posRightY);

cos() is a projection of the angle on the X axis, while sin() is the projection on the Y axis. They have a base length of 1, so we need to multiply by SIZE.
Here, I took half the angle since we are symmetrical with regard to the vertical axis. Which is the X axis we have rotated to comply to the drawing. Try with commenting out the rotate() line, if it confuses you.

Top Reply