Image manipulation

Here we will iterate over the bitmap array pix and we will change the color of prototype.pngto blue. Then, we will put the new image data into the canvas3

The JavaScript code for the above is:

for (var i = 0, n = pix.length; i < n; i ++) {
  imgData3.data[i ] = pix[i ];
   if (i % 4 == 0 ) {
     imgData3.data[i ] = 0;
   }
   else if (i % 4 == 1) {
     imgData3.data[i ] = 0;
   }
 }
 context3.putImageData(imgData3, 0, 0);

this will create the image:

Important Note: To do this exercise using your local file system, you will need to use Firefox as your browser. Chrome will display an error due to security constraints.