p5js 'line is not a function'

Question

我正在尝试使用 p5js 获取一组点并循环遍历它们以绘制线条。我的问题是，出于某种原因，我不断收到 'line is not a function.' 为什么？

的错误消息

function setup() {
    createCanvas(400, 400);
    background(255)

}

function draw() {
    strokeWeight(50);
    drawLetter(letterA);
}

const letterA = {
    lines: [
        { x1: 10, y1: 20, x2: 40, y2: 50 },
        { x1: 90, y1: 60, x2: 60, y2: 100 },
        { x1: 200, y1: 20, x2: 30, y2: 45 }
    ]
}

function drawLetter(letter) {

    for (let i = 0; i < letter.lines.length; i++) {
        const line = letter.lines[i];
        const { x1, y1, x2, y2 } = line;

        line(x1, y1, x2, y2);

    }
}

Answer 1

line 不是函数，因为您已将局部变量命名为“line”。局部变量覆盖函数“line”。重命名变量（例如 coordinates）：

function drawLetter(letter) {

    for (let i = 0; i < letter.lines.length; i++) {
        const coordinates = letter.lines[i];
        const { x1, y1, x2, y2 } = coordinates;

        line(x1, y1, x2, y2);

    }
}

或者完全跳过局部变量：

function drawLetter(letter) {

    for (let i = 0; i < letter.lines.length; i++) {
        const { x1, y1, x2, y2 } = letter.lines[i];

        line(x1, y1, x2, y2);

    }
}

p5js 'line is not a function'

p5js 'line is not a function'

javascript

processing

loops

p5.js