如何在随机 x 轴 p5.js 上生成一些东西

在p5.js中，我们可以使用随机函数来生成随机的形状和位置。如果我们只想在x轴上生成一些随机的形状，我们可以使用p5.js中的 random() 函数来实现。

第一步： 确定生成的数量

我们首先需要确定要生成的形状的数量。这可以通过一个变量来实现。

let shapeCount = 10; // 生成10个形状

第二步：生成形状的随机位置

我们需要为我们的每个形状生成一个随机的x轴位置。这可以通过使用 random() 函数和画布的宽度来实现。代码如下：

let xPos = random(width); // 在画布的范围内生成一个随机的x轴位置

第三步：生成随机形状

在这个例子中，我们将生成一些随机的圆形。我们可以使用 ellipse() 函数来画圆。

为了使每个圆的大小和颜色也是随机的，我们在每次循环中使用随机函数来生成随机的半径和颜色。代码如下：

let radius = random(10, 50); // 在10到50之间生成一个随机的半径
let color = color(random(255), random(255), random(255)); // 随机生成一个RGB颜色
fill(color);
ellipse(xPos, 50, radius, radius); // 在随机位置画圆

第四步：完整的代码

最后，这就是完整的生成随机x轴形状的p5.js代码。

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

function draw() {
  background(220);

  let shapeCount = 10; // 生成10个形状

  for (let i = 0; i < shapeCount; i++) {
    let xPos = random(width); // 在画布的范围内生成一个随机的x轴位置

    let radius = random(10, 50); // 在10到50之间生成一个随机的半径
    let color = color(random(255), random(255), random(255)); // 随机生成一个RGB颜色
    fill(color);
    ellipse(xPos, 50, radius, radius); // 在随机位置画圆
  }
}

总结

在p5.js中，我们可以使用随机函数来生成随机的形状和位置。这个简单的代码片段演示了如何在x轴上生成随机圆形，但这个方法也可以用于生成其他形状或图案。