Question

How to draw a line in browser with JavaScript

Answer 1

var canvas = document.createElement("canvas");
canvas.setAttribute("width", window.innerWidth);
canvas.setAttribute("height", window.innerHeight);
document.body.appendChild(canvas);

var ctx = canvas.getContext("2d");
  
ctx.fillRect(100, 100, 500, 1);

            
/*
run:

draw a 500 pixels width line
  
*/

 

70+ SQL courses for beginners and professionals

Answer 2

var canvas = document.createElement("canvas");
canvas.setAttribute("width", window.innerWidth);
canvas.setAttribute("height", window.innerHeight);
document.body.appendChild(canvas);

var ctx = canvas.getContext("2d");
  
ctx.fillStyle = "rgb(0, 0, 255)";  // blue
  
ctx.fillRect(100, 100, 500, 1);

            
/*
run:

draw a 500 pixels width blue line
  
*/

 

70+ SQL courses for beginners and professionals