HTML5 Game - Draw a simple white line through the rectangle we created above:

  1. HOME
  2. HTML5 Game
  3. Canvas
  4. Rectangle Methods

Description

Draw a simple white line through the rectangle we created above:

Demo

ResultView the demo in separate window 

<!doctype html>
<html lang="en">
<body>
<div style="position: absolute; top: 50px; left: 50px;">
<canvas id="canvas" width="500" height="500">
 Your browser does not support the HTML 5 Canvas. 
</canvas>/* w w w . j  a v a2s .  c  om*/
<script type="text/javascript">
  let theCanvas = document.getElementById('canvas');
    let ctx = theCanvas.getContext('2d');

  ctx.strokeStyle = "red"; 
  ctx.beginPath(); 
  ctx.moveTo(0,0); 
  ctx.lineTo(300,150); 
  ctx.stroke(); 

</script> 

</div>
</body>
</html>

Related Topic