使用for循环绘制不同的线条

// 获取Canvas元素
var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");

// 设置起点和终点坐标
var startX = 10;
var startY = 10;
var endX = 100;
var endY = 100;

// 使用for循环绘制不同的线条
for (var i = 0; i < 5; i++) {
  // 设置不同的起点和终点坐标
  startX += 20;
  startY += 20;
  endX += 20;
  endY += 20;

  // 绘制线条
  ctx.beginPath();
  ctx.moveTo(startX, startY);
  ctx.lineTo(endX, endY);
  ctx.stroke();
}