Bewegung auf einer Spirale in Processing

Hinzugefügt am von Steffen Fiedler

Powered by Processing.js

Ähnlich wie bei der Ellipse finden wir bei der Spirale einen 'dynamischen' Faktor welche die Form unserer Kreisbewegung beeinflusst. Für jeden Schritt um welchen der Winkel verschoben wird, erhöhen wir ebenfalls den Radius rad um den Wert 0.2. Dieser Wert beschreibt wie dicht oder offen unsere Spirale wächst. Verglichen mit dem Beispiel der gleichförmigen Kreisbewegung ist dies der einzige Unterschied, auch wenn das Resultat komplexer erscheint.

Der Sketch

float xcenter;   // Mittelpunkt auf der x-Achse
float ycenter;   // Mittelpunkt auf der y-Achse
float rad = 0;   // Radius der Kreisbahn
float angle = 0; // aktueller Rotationswinkel
 
void setup () {
  size(550, 200);
  smooth ();
  noStroke ();
  background (76);
 
  // Rotationsmittelpunkt
  xcenter = width / 2;
  ycenter = height / 2;
}
 
void draw () {
  fill (76, 4);
  rect (0, 0, width, height);
 
  // Verschieben des Rotationswinkels
  angle += 0.04;
  // Vergrößern des Radius
  rad += 0.2;
  
  // Zurücksetzen nach drei
  // Umdrehungen
  if (angle > PI * 6) {
      angle = 0;
      rad = 0;
  }
  
  // Berechnung der aktuellen Position
  float x = xcenter + cos (angle) * rad;
  float y = ycenter + sin (angle) * rad;
  
  // Zeichnen des Kreises
  fill (236);
  ellipse (x, y, 10, 10);
}