Wie ändere ich die Größe eines p5.Graphic-Objekts?

Question

In p5.js resizeCanvas(x, y) ist eine Funktion für p5-Objekte, aber wenn ich ein p5.Graphics Objekt gemacht habe, kann ich es mit einer ähnlichen Funktion ändern?

Interessanterweise p5.Graphics Objekte können resizeGraphics() laufen, aber nichts passiert (einschließlich kein Fehler) und die Höhe und Breite bleiben in der Konsole gleich.

g = createGraphics(50, 50); //creates p5.Graphics 
g.resizeCanvas(100, 100);  //fails: silently without error 
g.resize(100, 100);   //fails: resize has not been defined 

Gibt es eine andere Funktion oder brauche ich, um tatsächlich die cooresponding Grafiken Leinwand zu extrahieren und rufen eine native Javascript-Funktion statt?

Danke!

Answer 1

Wenn Sie die Größe eines P5.Graphics ändern möchten, können Sie einfach einen neuen erstellen und dann den alten auf den neuen zeichnen.

Here ist ein Beispiel:

var pg; 

function setup() { 
    createCanvas(1000, 1000); 
    pg = createGraphics(100, 100); 
    pg.background(100); 
    pg.noStroke(); 
    pg.ellipse(pg.width/2, pg.height/2, pg.width, pg.height); 
} 

function draw() { 
    background(200); 
    image(pg, 0, 0); 
} 

function mouseClicked(){ 
    var newPG = createGraphics(mouseX, mouseY); 
    newPG.image(pg, 0, 0, newPG.width, newPG.height); 
    pg = newPG; 
}