p5js kann keine Variable für Höhe oder Breite verwenden

Question

Ich bin neu bei p5.js und ich habe versucht, eine Minispiel-Sache zu machen, um mich selbst zu starten. Ich bin auf mehrere Probleme gestoßen, die ich lösen konnte und die ich nicht beheben konnte.

In p5.js, wenn Sie eine Leinwand erstellen Sie ein width und height Variable erhalten, die die Dimensionen der erzeugten Leinwand verwendet und scheint in anderen Orten zu arbeiten, wie die draw() Funktion aber nicht ein Mini-Objekt, das ich machen werde . Mein Code ist unten und ich danke Ihnen, wenn Sie antworten.

var Walls = new walls() 
function setup(){ 
    canvas = createCanvas(400,300); 
    canvas.parent("lor"); 

} 
function draw(){ 
    background(22,178,255) 
    console.log(Walls.wall1.height); 
} 
//Walls 
function walls(){ 
    this.wall1 = {} 
    this.wall1.width = 30 
    this.wall1.height = height/2 
} 

Ich warte auf Ihre Antwort, da ich mehr als eine Stunde damit verbracht habe, dies herauszufinden. Vielen Dank!

Answer 1

Das Problem liegt in der Reihenfolge Ihres Codes. Das erste, was das Skript ausführt, ist var Walls = new walls();, das vor dem Setup aufgerufen wird, wo die Arbeitsfläche erstellt wird. Also, was Sie tun, ruft height, bevor die Leinwand erstellt wird. Dies kann einfach dadurch gelöst werden, dass die globale Variable deklariert wird, sie aber innerhalb von Setup einen Wert erhält.

//Declaring the empty variable 
var walls; 

function setup() { 
    //creating the canvas 
    canvas = createCanvas(400, 300); 

    //calling Walls() 
    walls = new Walls(); 
} 

function draw() { 
    background(22, 178, 255); 
    console.log("Height: " + walls.wall1.height); 
} 

function Walls() { 
    this.wall1 = {}; 
    this.wall1.width = 30; 
    this.wall1.height = height/2; 
} 

Höhe: 150