如何在使用canvas.drawLine()打印多行时添加时间延迟

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

// 定义绘制线条的起点和终点坐标
const startX = 50;
const startY = 50;
const endX = 250;
const endY = 250;

// 定义绘制多行的时间间隔和行数
const delay = 1000; // 延时1秒
const numLines = 5; // 绘制5行

// 绘制多行线条的函数
function drawMultiLines(lines) {
  let currentLine = 0;
  
  function drawLine() {
    if (currentLine < lines) {
      // 绘制当前行的线条
      ctx.beginPath();
      ctx.moveTo(startX, startY + currentLine * 50);
      ctx.lineTo(endX, endY + currentLine * 50);
      ctx.stroke();
      
      currentLine++;
      
      // 延时执行下一行的绘制
      setTimeout(drawLine, delay);
    }
  }
  
  // 调用函数开始绘制多行线条
  drawLine();
}

// 调用函数开始绘制多行线条
drawMultiLines(numLines);