Verschieben von der Verarbeitung zu p5.js

Question

Ich mache ein paar einfache Experimente mit der Verarbeitungsbibliothek und möchte eine dieser Skizzen in P5.js portieren, damit sie im Web platziert werden kann. Unten ist der Code in der Verarbeitung (Java):

float t; 

void setup() { 
    background(20); 
    size(500, 500); 
} 

void draw(){ 
    stroke(random(0,255), random(0,255), random(0,255)); 

    translate(width/2, height/2); 
    rotate(radians(45)); 
    line(x(t), y(t), y(t), x(t)); 
    println(x(t)); 
    println(y(t)); 
    t++; 


} 

float x(float t) { 
    return cos(t/10) * 200; 
} 

float y(float t) { 
    return sin(t/100) * 200; 
} 

ich die Werte von x am Druck (t) und y (t) als Referenz, und sie werden in der Bearbeitungskonsole in Ordnung. Ich habe versucht, diese neu zu schreiben von P5.js in Kauf genommen werden (JavaScript):

var t; 

function setup() { 
    background(20); 
    createCanvas(500, 500); 
} 

function draw(){ 
    stroke(random(0,255), random(0,255), random(0,255)); 

    translate(width/2, height/2); 
    rotate(radians(45)); 
    line(x(t), y(t), y(t), x(t)); 
    print(x(t)); 
    print(y(t)); 
    t++; 
} 

function x(t) { 
    return cos(t/10) * 200; 
} 

function y(t) { 
    return sin(t/100) * 200; 
} 

Als ich diese laufen in der P5.js Entwicklungsumgebung, die Konsole gibt für jeden Wert null, und nichts wird auf dem Bildschirm gezeichnet. Hoffentlich kann jemand helfen, danke!

Answer 1

In der Verarbeitung (die auf Java basiert) erhält Ihre t Variable den Standardwert float von 0.0.

In P5.js (die auf JavaScript basiert) erhält Ihre t Variable den Standardwert . Sie versuchen dann, diesen Wert mit anderen Operationen zu verwenden, weshalb keiner von ihnen wie erwartet funktioniert.

Die einfache Lösung für Ihr Problem ist nur manuell den Standardwert auf 0 setzen.

Answer 2

Versuchen Sie sagen: var t = 0; an der Spitze statt: var t;