p5.js | endContour()函数

在p5.js中，endContour()函数是一种3D形状绘制方法，它可以结束当前的形状轮廓。当我们想要在形状内部创建新的轮廓时，这个函数就非常有用。

语法

endContour();

参数

endContour()函数不接受任何参数。

示例

下面我们来看一个简单的示例。在这个例子中，我们将创建一个圆锥体，并将一个圆放置在锥体的底部。我们将使用endContour()函数来结束圆的轮廓。

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

function draw() {
  background(220);

  // 创建一个圆锥体
  beginShape();
  vertex(0, 0, 0);
  vertex(50, 50, 50);
  vertex(-50, 50, 50);
  endShape(CLOSE);

  // 开始新的轮廓，并画一个圆
  beginShape();
  for (let i = 0; i < TWO_PI; i += 0.1) {
    let x = cos(i) * 20;
    let y = sin(i) * 20;
    vertex(x, y, 0);
  }
  endContour();
  endShape(CLOSE);
}

在上面的例子中，我们首先使用beginShape()函数创建了一个圆锥体的轮廓。然后，我们使用endShape(CLOSE)函数来关闭这个轮廓。

接下来，我们再次调用beginShape()函数，开始一个新的轮廓。在这个轮廓中，我们使用for循环生成了一个圆，并使用vertex()函数将圆上的点添加到这个轮廓中。最后，我们使用endContour()函数来结束这个轮廓。

注意事项

在使用endContour()函数时，需要注意以下几点：

• endContour()函数必须在beginShape()函数之后调用，并且在开始下一个轮廓之前调用。
• 在调用endContour()函数之前，必须添加足够多的点来形成完整的轮廓。如果添加的点数量不足，可能会导致绘制失败或不完整的图像。
• 调用endContour()函数后，可以继续添加点来创建新的轮廓或添加到之前的轮廓中。

结论

endContour()函数是p5.js中非常有用的一个函数，它可以帮助我们在创建复杂的形状时更轻松地控制轮廓和形状的层次结构。在了解了这个函数的使用方法后，我们可以更好地理解3D形状绘制的原理，为我们的创作提供更多的可能性。