如何在每个点之间创建一条线？

Question

我想创建一个类似于 photoshop/illustrator 中的 pentool 的工具，但只使用直线。我如何在每个点之间创建一条线？我的第一直觉是将它们推入一个阵列，但我在这里堆叠，接下来我该怎么做？

代码：https://editor.p5js.org/AlexArek/sketches/4TZ1Y-6y0

Answer 1

如果我没理解错的话，你被卡住了是因为你在 for 循环中使用 push()，这个循环由你试图推入的数组的长度决定是空的。换句话说，for 循环中的代码永远不会被执行。我不熟悉 pentool，但我假设您想在一系列点之间画一条直线，在这种情况下这可能会有所帮助：

let points = [];

function setup() {
  createCanvas(800, 600);
  background(35);
}

function draw() {}

function mousePressed() {
  stroke(255);
  strokeWeight(10);
  point(mouseX, mouseY);
  points.push({x:mouseX, y:mouseY});
  if(points.length > 1)
    line(points[points.length-1].x, points[points.length-1].y, points[points.length-2].x, points[points.length-2].y);
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.7.3/p5.min.js"></script>

如何在每个点之间创建一条线？

How do I create a line between each point?

p5.js