We closed this forum 18 June 2010. It has served us well since 2005 as the ALPHA forum did before it from 2002 to 2005. New discussions are ongoing at the new URL http://forum.processing.org. You'll need to sign up and get a new user account. We're sorry about that inconvenience, but we think it's better in the long run. The content on this forum will remain online.
IndexProgramming Questions & HelpPrograms › Clock Code Question
Page Index Toggle Pages: 1
Clock Code Question (Read 931 times)
Clock Code Question
Mar 2nd, 2010, 2:21pm
 
I recently found this code under the Learning Portion of Processing.org:

Quote:
The current time can be read with the second(), minute(), and hour() functions. In this example, sin() and cos() values are used to set the position of the hands.


void setup() {
 size(200, 200);
 stroke(255);
 smooth();
}
void draw() {
 background(0);
 fill(80);
 noStroke();
 // Angles for sin() and cos() start at 3 o'clock;
 // subtract HALF_PI to make them start at the top
 ellipse(100, 100, 160, 160);
 float s = map(second(), 0, 60, 0, TWO_PI) - HALF_PI;
 float m = map(minute() + norm(second(), 0, 60), 0, 60, 0, TWO_PI) - HALF_PI;
 float h = map(hour() + norm(minute(), 0, 60), 0, 24, 0, TWO_PI * 2) - HALF_PI;
 stroke(255);
 strokeWeight(1);
 line(100, 100, cos(s) * 72 + 100, sin(s) * 72 + 100);
 strokeWeight(2);
 line(100, 100, cos(m) * 60 + 100, sin(m) * 60 + 100);
 strokeWeight(4);
 line(100, 100, cos(h) * 50 + 100, sin(h) * 50 + 100);
 
 // Draw the minute ticks
 strokeWeight(2);
 for (int a = 0; a < 360; a+=6) {
   float x = 100 + ( cos(radians(a)) * 72 );
   float y = 100 + ( sin(radians(a)) * 72 );
   point(x, y);
 }
}


I'm having difficulty understanding the purpose of the sine and cosine functions. How are they setting the positions of the hands? For something like this, I would expect three separate rotations of the hands, set to match real time.
(On a somewhat related note, how are the 2*PI and HALF_PI seen in the variables related to the sine and cosine functions?)
Re: Clock Code Question
Reply #1 - Mar 2nd, 2010, 2:44pm
 
Have you read the trigonometry primer... here:

http://processing.org/learning/trig/

You do need to have an understanding of this in order to understand how these functions are being used here.

Or was it some detail of the use of the functions you didn't understand(I'm not sure, don't want to be patronising).
Re: Clock Code Question
Reply #2 - Mar 2nd, 2010, 3:54pm
 
Thank you, the link cleared up some of my confusion.
However, since the ellipse's radius is 160, why isn't the code written as cos(s)*80? Isn't the format 'cos(angle)*radius' ?
Re: Clock Code Question
Reply #3 - Mar 2nd, 2010, 3:58pm
 
The ellipse's diameter is 160, radius 80.
Re: Clock Code Question
Reply #4 - Mar 2nd, 2010, 4:45pm
 
Sorry, yes, I meant diameter.
Thank you for the link; now I have a better understanding of trig in Processing. As for the cosine and sine functions, I finally realized that the radii involved for the three lines weren't referring to the clock ellipse, so I understand what I need to do now.
Thanks for your help!
Page Index Toggle Pages: 1