Erstellen eines "animierten" Spiky Balls in Processing.js

Question

Für meine Klasse erstelle ich ein Projekt, bei dem eine Ebene einen Cursor in Form einer Ellipse enthält, die auf einen mousPressed Befehl reagiert, indem sie innerhalb der Ellipse und dann zurück in die Ellipse. Der Code für mein Cursor ist hier richtig:

class Cursor{ 

float r; 
float x; 
float y; 

    Cursor(float _r){ 
    r = _r; 
    x = 0; 
    y = 0; 
    } 

    void setLocation (float _x, float _y) { 
    x = _x; 
    y = _y; 
} 

void display(){ 
noStroke(); 
fill(230, 242, 255); 
ellipse(x, y, r, r); 
} 

Mein Lehrer schlug ich create (TRIANGLE) innerhalb der Ellipse verwenden und von jeder Spitze einen der Eckpunkte animieren zu gegebener Zeit herauskommen, aber ich einfach wasn‘ Ich konnte seinen Anweisungen so gut folgen wie nötig. Jede Hilfe in dieser Angelegenheit würde sehr geschätzt werden. Ich hoffe, dass ich die animierten Vertices weiter dazu nutze, später ein umgebendes Objekt "aufzuspießen", aber ich erwähne das nur, wenn es für die anfängliche Erstellung und Animation wichtig ist.

Vielen Dank im Voraus!

Answer 1

Ihr Lehrer sprach wahrscheinlich über die beginShape(TRIANGLES) Funktion. Aus dem Referenz:

beginShape(TRIANGLES); 
vertex(30, 75); 
vertex(40, 20); 
vertex(50, 75); 
vertex(60, 20); 
vertex(70, 75); 
vertex(80, 20); 
endShape(); 

könnten Sie diese Funktion benutzen, um Ihre Spitzen um den Kreis zu erzeugen. Sie müssen die x und y Positionen der Dreiecke um den Kreis herausfinden, aber Sie können das tun, indem Sie einen steigenden Winkel und die cos() und sin() Funktionen verwenden.