p5.Graphics的saveFrames（）

Question

p5Graphics-saveFrames-image

嗨，只是编程处理了几年。

今天，我使用p5js进行Web前端开发（https://p5js.org）

然后面对有关p5.Graphics上的saveFrames（）的一些错误

您可以运行示例代码here或在下面查看

var pg;

function setup() {
let c = createCanvas(100, 100);
  pg=createGraphics(20,20);
  pg.background(0,255,0);
  background(255, 0, 0);
  pg.saveFrames('test','jpg',1,1,data=>{ // <<<< error occurred
    print('result',data)
  });
}

然后控制台说，

未捕获的TypeError：无法读取未定义的属性'elt'（草图：第8行）

是，它对将p5.Graphics面板保存为data_url起到了积极作用。喜欢保存PGraphics作为处理中的图像。

我知道，

• 是否可以保存p5.Graphics
• 或有某种方法可以修复elt错误。
• 或无论如何使p5.Graphics成为图像/数据URL

谢谢

Answer 1

那是因为图形对象没有这样的方法，除了您需要以某种方式使用提供的pg在draw()方法中actually渲染这些帧。像：

var pg;

function setup() {
  var c= createCanvas(200, 200);
  pg=createGraphics(150,150);
  pg.background(112, 0, 112);
  pg.ellipse(50, 50, 15, 45);
  saveFrames('test','jpg',1,1,data=>{print('result',data)});
}

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