使用 p5.js 绘制动态彩色线条：跟随鼠标移动变化颜色

在 p5.js 中，可以使用 'createCanvas()' 函数创建画布，并使用 'mouseX' 和 'mouseY' 变量获取鼠标的当前位置。以下是使用 p5.js 绘制一条 3 毫米粗的、随着鼠标移动不断变化颜色的线的示例代码：

function setup() {
  createCanvas(400, 400);
}

function draw() {
  background(220);
  
  // 计算线的颜色
  let lineColor = color(mouseX % 255, mouseY % 255, 0);
  
  // 设置线的属性
  strokeWeight(3);
  stroke(lineColor);
  
  // 绘制线
  line(0, 0, mouseX, mouseY);
}

在上述代码中，我们使用 'background(220)' 函数设置画布的背景颜色为灰色。然后，我们使用 'color()' 函数创建一个颜色对象，该颜色对象的红色分量取决于鼠标的 X 坐标，绿色分量取决于鼠标的 Y 坐标，而蓝色分量为 0。接下来，我们使用 'strokeWeight()' 函数设置线的宽度为 3 个像素，并使用 'stroke()' 函数设置线的颜色为计算得到的颜色对象。最后，我们使用 'line()' 函数绘制一条从坐标 (0, 0) 到鼠标的当前位置的线。