p5.Image save() 方法

p5.js 中 p5.Image 的save() 方法用于通过强制浏览器下载来将图像保存到文件中。该文件可以保存为两种格式，“png”和“jpg”。如果动画 GIF 与 p5.Image 一起使用，它也可以使用“gif”扩展名保存。

注意：不建议在 draw() 循环中调用此函数，因为它会在每次绘制调用时提示一个新的保存对话框。

句法：

save( filename, extension )

参数：此函数接受两个参数，如上所述和如下所述。

• 文件名：它是一个字符串，指定保存文件的文件名。
• 扩展名：它是一个字符串，指定保存文件的扩展名。它可以是值“png”或“jpg”中的任何一个。

以下示例说明了 p5.js 中的save() 方法：

示例 1：

javascript

function preload() {
    img = loadImage("sample-image.png");
}
 
function setup() {
    createCanvas(500, 300);
    textSize(20);
 
    // Apply filter to image
    img.filter(GRAY);
 
    text('Current Image', 20, 20);
    image(img, 20, 40, 200, 100);
}
 
function keyTyped() {
 
  // Pressing the "q" key to
  // save the image
  if (key === 'q') {
    img.save('saved-image', 'png');
  }
}

输出：

示例 2：

javascript

function preload() {
    img = loadImage("sample-gif.gif");
}
 
function setup() {
    createCanvas(500, 300);
    textSize(20);
 
    text('Current GIF', 20, 20);
    image(img, 20, 40, 200, 100);
 
    btnSave = createButton("Save GIF");
    btnSave.position(30, 160);
    btnSave.mousePressed(saveImg);
}
 
function saveImg() {
 
    // Save the GIF
    img.save("new-gif");
}

输出：

在线编辑器： https://editor.p5js.org/
环境设置： https://www.geeksforgeeks.org/p5-js-soundfile-object-installation-and-methods/
参考： https://p5js.org/reference/#/p5.Image/save