p5.js | strokeJoin()函数

p5.js 中的strokeJoin()函数用于设置连接线段的关节样式。这些接头可以是斜接、斜切或倒圆的，并使用相应的参数 MITRE、BEVEL 和 ROUND 指定。 MITRE 是默认关节。

句法：

strokeJoin(join)

参数：此函数接受单参数连接，它存储关节参数常量“MITER”、“BEVEL”或“ROUND”。

下面的程序说明了 p5.js 中的 strokeJoin()函数：

示例 1：此示例使用 strokeJoin()函数来连接笔划。

function setup() {
      
    // Create Canvas of given size
    createCanvas(380, 170);
}
  
function draw() {
      
    // Set the background color
    background(220);
      
    // Set the stroke weight
    strokeWeight(12);
      
    // Set strokeJoin function
    strokeJoin(ROUND);
      
    // Function to create line segment
    line(20, 30, 200, 30);
    line(200, 30, 200, 100);
    line(200, 100, 20, 30);
}

输出：

示例 2：此示例使用 strokeJoin()函数来连接笔划。

function setup() {
      
    // Create Canvas of given size
    createCanvas(380, 170);
}
  
function draw() {
      
    // Set the background color
    background(220);
      
    // Set the stroke weight
    strokeWeight(10);
      
    // Set strokeJoin function
    strokeJoin(BEVEL);
      
    // Function to create line segment
    line(20, 30, 200, 30);
    line(200, 30, 200, 100);
    line(200, 100, 20, 100);
    line(20, 100, 20, 30);
}

输出：

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