Canvas Test

test for Canvas

by Rijo R

HTML

<body>
  <canvas id="canvas1" width="1000" height="1000"></canvas>
</body>

CSS

#canvas1 {
  background: #000000;
}

JavaScript

function draw() {
var canvas=document.getElementById("canvas1");
  var ctx = canvas.getContext("2d");

  // Rectangle position
  var posX = 5;
  var posY = 5;
  ctx.fillStyle = "white";
  ctx.fillRect(posX, posY, 50, 50);
  
  function animate() {
  ctx.clearRect(0,0,innerWidth,innerHeight);
  requestAnimationFrame(animate);
   ctx.fillRect(posX, posY, 50, 50);
   posX+=1;
  }
  animate();

}
window.onload = draw;