Чтобы нарисовать горизонтальную линию на холсте, вы можете использовать несколько методов. Вот несколько вариантов:

1. Метод 1: использование функций moveTo()и lineTo():

   var canvas = document.getElementById("myCanvas");
   var context = canvas.getContext("2d");
   context.moveTo(0, 50);
   context.lineTo(canvas.width, 50);
   context.stroke();

2. Метод 2: использование функций beginPath()и strokeRect():

   var canvas = document.getElementById("myCanvas");
   var context = canvas.getContext("2d");
   context.beginPath();
   context.fillRect(0, 50, canvas.width, 1);
   context.stroke();

3. Метод 3. Использование функций createLinearGradient()и fillRect():

   var canvas = document.getElementById("myCanvas");
   var context = canvas.getContext("2d");
   var gradient = context.createLinearGradient(0, 50, canvas.width, 50);
   gradient.addColorStop(0, "black");
   gradient.addColorStop(1, "black");
   context.fillStyle = gradient;
   context.fillRect(0, 50, canvas.width, 1);

4. Метод 4. Использование стилей CSS:

   <canvas id="myCanvas" ></canvas>

   Затем вы можете использовать CSS, чтобы установить высоту и ширину элемента холста, а также свойство border-bottom для создания эффекта горизонтальной линии.