Computer >> Computer tutorials >  >> Programming >> HTML

How to draw a line with lineTo() in HTML5?


To draw a line in HTML, use the canvas element. With canvas, use the lineTo() method to draw a line. The lineTo() method includes x and y parameter values, which positions the line.

How to draw a line with lineTo() in HTML5?

Example

You can try to run the following code to draw a line with lineTo() in HTML5 −

<!DOCTYPE html>
<html>
   <head>
      <title>HTML Canvas</title>
   </head>
   <body>
      <canvas id="newCanvas" width="300" height="150" style="border:1px solid #000000;"></canvas>
      <script>
         var c = document.getElementById("newCanvas");
         var ctxt = c.getContext("2d");
         ctxt.beginPath();
         ctxt.moveTo(70, 50);
         ctxt.lineTo(50, 120);
         ctxt.stroke();
      </script>
   </body>
</html>