2

Is it possible to do this with html canvas?

With this 

   for (var i = 0; i < data.length; i += 4) {
      var grayscale = data[i]*0.2126 + data[i +1]*0.7152 + data[i +2]*0.0722;
      data[i]     = grayscale; // red
      data[i + 1] = grayscale; // green
      data[i + 2] = grayscale; // blue
    }

I iterate over all pixel and grayscale them. I know how to convert that into a base64 code but waht if I only want the gray values of the image instead of the whole RGB image?

Tom
  • 2,545
  • 5
  • 31
  • 71
  • Explain more please. – THE AMAZING Aug 28 '15 at 15:27
  • I want to llop through the image data, calculate each pixel and add it to a string. is that possible? – Tom Aug 28 '15 at 15:56
  • Okay, so you have an existing image & you want to get the image data into an array? – THE AMAZING Aug 28 '15 at 16:00
  • check out: http://stackoverflow.com/questions/8751020/how-to-get-a-pixels-x-y-coordinate-color-from-an-image – THE AMAZING Aug 28 '15 at 16:01
  • sorry i was wrong, what I meant, I grayscale a picture and I only want the grayscale values of the image as a string instead of the whole color picture I updated my question, sorry for the confusion ! – Tom Aug 28 '15 at 16:05
  • I want that in order to to get a smaller sized image. Since it's grayscaled I don't want the color channels, is that possible? – Tom Aug 28 '15 at 16:12
  • You could (1) Save your remaining grayscale values to a `Uint8Array`, (2) Stringify that array with `var s=myUint8Array.toString()`, (3) Base64 encode that string with `btoa(s)`. My question is what are you going to use that result for? – markE Aug 28 '15 at 22:11

0 Answers0