p5.js IO 完整参考

p5.js 是一个基于 JavaScript 的创意编码框架，它集成了丰富的库和工具，使得开发者可以通过编写简单的代码来实现互动、动态和可视化效果。p5.js IO 是p5.js的一个重要模块，它提供了多种输入输出方式，包括加载和保存文件、连接网络和串口通信等功能，方便程序员实现更加丰富的互动效果。

加载和保存文件

p5.js IO 可以轻松地加载和保存文件，其中 loadImage() 函数加载图片文件，loadJSON() 函数加载 JSON 文件，loadXML() 函数加载 XML 文件等等。同时，saveCanvas() 函数可以保存 canvas 中的内容，saveStrings() 函数可以保存字符串为 txt 文件等等。

// 加载图片
function preload() {
  img = loadImage('/path/to/image.jpg');
}

// 加载 JSON
function preload() {
  json = loadJSON('/path/to/data.json');
}

// 保存 canvas
function keyPressed() {
  if (key == 's') {
    saveCanvas('myCanvas', 'jpg');
  }
}

// 保存字符串为 txt
function setup() {
  strings = ['Hello', 'World'];
  saveStrings(strings, 'myData.txt');
}

连接网络

p5.js IO 提供了多种方式连接网络，其中 loadJSON() 和 loadXML() 函数可以读取 API 中的数据，loadTable() 函数可以读取 csv 文件内容等等。同时，httpGet() 函数和 httpPost() 函数可以进行 GET 和 POST 请求，loadStrings() 函数可以读取网页内容等等。

// 读取 API 数据
function setup() {
  var url = 'https://api.openweathermap.org/data/2.5/weather?q=NewYork&appid=API_KEY';
  loadJSON(url, gotData);
}

function gotData(data) {
  console.log(data);
}

// 读取 csv 文件
function preload() {
  table = loadTable('/path/to/data.csv', 'csv', 'header');
  console.log(table);
}

// GET 请求
function setup() {
  var url = 'https://www.googleapis.com/books/v1/volumes?q=isbn:0747532699';
  httpGet(url, 'json', false, function(response) {
    console.log(response);
  });
}

// 读取网页内容
function setup() {
  var url = 'https://p5js.org/reference/';
  loadStrings(url, gotData);
}

function gotData(data) {
  console.log(data);
}

串口通信

p5.js IO 还支持串口通信，其中 serial.on() 函数和 serial.write() 函数可以进行读取和写入串口数据的操作，serial.list() 函数可以列出可用串口等等。

// 列出可用串口
function setup() {
  serial = new p5.SerialPort();
  serial.list();
}

// 读取串口数据
function setup() {
  serial = new p5.SerialPort();
  
  serial.on('data', gotData);

  function gotData() {
    console.log(data);
  }
}

// 写入串口数据
function setup() {
  serial = new p5.SerialPort();

  serial.write('Hello Serial');
}

总之，p5.js IO 提供了多种输入输出方式，使得程序员可以轻松实现互动效果。以上是p5.js IO API 的完整参考，希望能对你有所帮助。