p5.js | saveCanvas()函数

saveCanvas()函数用于将 p5.Table 对象保存到文件中。保存的文件格式可以定义为函数的参数。默认情况下，它使用逗号分隔值保存文本文件，但是，它可用于使用制表符分隔值保存它或从中生成 HTML 表格。

句法：

saveCanvas(selectedCanvas, filename, extension)

saveCanvas(filename, extension)

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

• selectedCanvas：这是一个将保存到文件中的 p5.Table 对象。
• 文件名：它指定用作保存文件的文件名的字符串。它是一个可选参数。
• 扩展名：它是一个字符串，表示要保存的文件的扩展名。它是一个可选参数。

下面的示例说明了 p5.js 中的saveCanvas()函数：

例子：

function preload() {
  img = loadImage('sample-image.png');
}
  
function setup() {
  createCanvas(600, 300);
  textSize(22);
  
  background("orange");
  text("Click on the button to save the"+
       " current canvas to file", 20, 40);
  image(img, 30, 60);
  
  // Create a button for saving the canvas
  removeBtn = createButton("Save Canvas");
  removeBtn.position(30, 200)
  removeBtn.mousePressed(saveToFile);
}
  
function saveToFile() {
  // Save the current canvas to file as png
  saveCanvas('mycanvas', 'png')
}

输出：

在线编辑器： https://editor.p5js.org/

环境设置： https://www.geeksforgeeks.org/p5-js-soundfile-object-installation-and-methods/

参考： https://p5js.org/reference/#/p5/saveCanvas