If you're seeing this message, it means we're having trouble loading external resources on our website.

Wenn du hinter einem Webfilter bist, stelle sicher, dass die Domänen *. kastatic.org und *. kasandbox.org nicht blockiert sind.

Hauptinhalt

Winkelgeschwindigkeit

Erinnerst du dich an dieses Zeugs?
Position = Position + Geschwindigkeit
Geschwindigkeit = Geschwindigkeit + Beschleunigung
Diesen Dingen haben wir fast zwei Kapitel gewidmet. Nun wir können die genau gleiche Logik auch zur Drehung von Objekten verwenden.
Winkel = Winkel + Winkelgeschwindigkeit
Winkelgeschwindigkeit = Winkelgeschwindigkeit + Winkelbeschleunigung
Tatsächlich ist die Berechnung oben sogar noch einfacher als die vorhergehende, da Winkel Skalare (einfache Zahlen) und keine Vektoren sind.
Wir verwenden das Result aus der letzten Challenge. Sagen wir mal wir wollen eine Stock mit ProcessingJS um einen Winkel drehen. Wir würden etwa Folgendes programmieren:
translate(width/2, height/2);
rotate(angle);
line(-50, 0, 50, 0);
ellipse(50, 0, 8, 8);
ellipse(-50, 0, 8, 8);
Nachdem wir unser Prinzip der Bewegung angewandt haben, kommen wir zum Programm unten. Der Stock beginnt ohne Drehung und dreht dann immer schneller und schneller, wenn die Winkelgeschwindigkeit beschleunigt:
Diese Idee kann auch in unseren Mover eingearbeitet werden. Zum Beispiel können wir die Eigenschaften in Bezug auf Winkelbewegung dem Konstruktor unseres Movers hinzufügen.
var Mover = function(m, x, y) {
    this.position = new PVector(x, y);
    this.mass = m;

    this.angle = 0;
    this.aVelocity = 0;
    this.aAcceleration = 0;

    this.velocity = new PVector(random(-1, 1), random(-1, 1));
    this.acceleration = new PVector(0, 0);
};
Und dann aktualisieren wir in der Methode update() sowohl die Position als auch den Winkel gemäß dem gleichen Algorithmus!
Mover.prototype.update = function () {

    this.velocity.add(this.acceleration);
    this.position.add(this.velocity);

    this.aVelocity += this.aAcceleration;
    this.angle += this.aVelocity;

    this.acceleration.mult(0);
};
Aber damit all dies funktioniert, müssen wir das Objekt bei der Darstellung natürlich auch noch rotieren.
Mover.prototype.display = function () {
    stroke(0, 0, 0);
    fill(175, 175, 175, 200);
    rectMode(CENTER);

    // pushMatrix und popMatrix sind notwendig, damit die Rotation der 
    // Form den Rest der Simulation nicht beeinflusst
    pushMatrix();
    // Setzt den Ursprung an die Position der Form
    translate(this.location.x, this.location.y);
    // Drehung um den Winkel
    rotate(this.angle);
    rect(0, 0, this.mass*16, this.mass*16);
    popMatrix();
};
Aber wenn wir jetzt den Code oben ausführen würden, würden wir trotzdem nichts neues sehen. Das liegt daran, dass die Winkelbeschleunigung (this.aAcceleration = 0;) mit Null initialisiert wird. Damit sich das Objekt dreht, müssen wir ihm eine Drehbeschleunigung geben! Natürlich könnten wir einfach eine andere hartcodierte Zahl verwenden:
this.aAcceleration = 0.01;
Ein Programm mit der Progammlogik wie oben und der Anziehungskraft eines zentralen Objektes sieht so aus:
Dies ist ein guter Anfang, aber wir können ein spannenderes Resultat erzielen, wenn wir die Winkelbeschleunigung dynamisch, basierend auf den Kräften in der Simulation berechnen. Denn Objekte drehen sich nicht einfach aus eigenem Antrieb! Nun können wir weiter diesem Pfad folgen und die Physik der Winkelbeschleunigung programmieren indem wir Konzepte wie Drehmoment und Trägheitsmoment verwenden. Aber dieses Niveau von Simulationen würde den Rahmen dieses Kurses sprengen. Trotzdem wird es nun noch ein bisschen komplexer.
Vorläufig ist eine schnelle und nicht perfekte Lösung ausreichend. Wir können ein vernünftiges Ergebnis erzielen indem wir einfach die Winkelbeschleunigung als Funktion des Beschleunigungsvektors des Objektes berechnen. Hier ein Beispiel:
this.aAcceleration = this.acceleration.x;
Ja, das ist wirklich willkürlich gewählt. Aber es tut etwas. Wenn das Objekt nach rechts beschleunigt, dreht es sich im Uhrzeigersinn, und eine Beschleunigung nach links führt zu einer Drehung gegen den Uhrzeigersinn. Natürlich ist es auch in diesem Fall wichtig über den Maßstab nachzudenken. Die x-Komponente des Beschleunigungsvektors könnte eine Zahl sein, die zu groß ist, wodurch sich das Objekt in einer Weise dreht, die unrealistisch aussieht. Daher würde es helfen, die x-Komponente durch einen bestimmten Wert zu dividieren oder die Winkelgeschwindigkeit in einem vernünftigen Bereich einzuschränken. Und hier nun die Methode update() inklusive dieser zwei Modifikationen.
Mover.prototype.update = function () {
    this.velocity.add(this.acceleration);
    this.position.add(this.velocity);

    // Calculate angular acceleration based on horizontal acceleration,
    //  and divide so it's not as strong
    this.aAcceleration = this.acceleration.x / 10{,}0;
    this.aVelocity += this.aAcceleration;

    // Use constrain to ensure velocity doesn't spin out of control
    this.aVelocity = constrain(this.aVelocity, -0{,}1, 0{,}1);
    this.angle += this.aVelocity;

    this.acceleration.mult(0);
};
Und so sieht das Programm mit all diesen Modifikationen aus:

Der Kurs "Natürliche Simulationen" ist eine Bearbeitung von "The Nature of Code" von Daniel Shiffman, und wird unter der Creative Commons Attribution-NonCommercial 3,0 Unported Lizenz verwendet.