Animate the canvas to infinitely animate noise to give the appearance of motion in HTML

#putImageData() method places image data onto the canvas. To animate the canvas, we create a reusable ImageData object outside the main loop,

var ct = c.getContext("2d", {alpha: false});       // context without alpha channel.
var a = ct.createImageData(c.width, c.height);  
var buffer = new Uint32Array(a.data.buffer);  

function loop() {
   noise(ct);
   requestAnimationFrame(loop)
})()

function noise(ct) {
   var l =buffer.length - 1;
   while(l--) buffer[l] = Math.random() <0.5 ?0 : -1>>0;
   ct.putImageData(a, 0, 0);
}

The above is the detailed content of Animate the canvas to infinitely animate noise to give the appearance of motion in HTML. For more information, please follow other related articles on the PHP Chinese website!