Draw a line on html5 canvas - Javascript Canvas

Javascript examples for Canvas:Line

  1. HOME
  2. Javascript
  3. Canvas
  4. Line

Description

Draw a line on html5 canvas

Demo Code

ResultView the demo in separate window 

<html>
   <head> 
      <meta name="viewport" content="width=device-width, initial-scale=1"> 
   </head> 
   <body>  
       If canvas width is greater than 32767, Chrome can't draw anything.
      <br> 
      <canvas id="myCanvas" width="32768" height="100" style="border-bottom: 1px solid #c30;"></canvas> 
      <script type="text/javascript">
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.lineWidth = 5;/*from   w w w.  j  a  va2 s .  c  o  m*/
ctx.moveTo(10,50);
ctx.lineTo(300,50);
ctx.stroke();

      </script>    
   </body>
</html>

Related Tutorials