Javascript Html画布使用点绘制线

我想上传图像的基础上，如何在选定的点之间画一条线，我想捕捉那个特定的图像

---

因此，请建议如何使用html5编写，您可以绘制一条路径，在画布上指定某些点或点以在它们之间画一条线。然后你可以画这条线，把它画到画布上

var canvas = document.body.appendChild(document.createElement("CANVAS")), context = canvas.getContext("2d");

context.beginPath();
  // all points are given as x (from left to right), y (from top to bottom)
  context.moveTo(10, 20); // x = 10 (10 px from the left edge of the canvas), y = 20 (20 px from the top edge of the canvas)
  context.lineTo(100, 97); // x = 100, y = 97
  context.lineTo(50, 105); // x = 50, y = 100

context.stroke();

---

[]

显示您的代码工作。stackoverflow不是代码生成器XDI要动态绘制线。好的。所以你们可以使用变量和循环等等来说明每个点的位置。你们能给我发一个基于点的创建矩形的示例代码吗？把我链接到的那个MDN页面去掉。它解释了如何使用画布路径执行任何您喜欢的操作。在用线条或颜色填充之前，可以使用rect绘制矩形或正方形，也可以使用fillRect或strokeRect一次性完成所有操作。或者，您可以使用该lineTo来使用组成矩形4个角的值。MDN页面真的非常有用，所以我建议大家看看这个页面，看看你是怎么做的。如果你读完那页的相关部分后仍然有问题，你可以再问我一次。我很乐意提供帮助。我完成了添加点的操作，但如果第一个点和最后一个点相同，我需要退出一个路径