If a 16-bit single channel (Gray-scale) raw pixel data losslessly encoded into Image format(e.g.PNG, Webp , Jpeg-2000 or JPEG-XR) and Image rendered to HTML5 canvas, then is there any way to retrieve original 16-bit Raw pixel data from the canvas?
Asked
Active
Viewed 1,907 times
4
-
Did you find the answer to this? – Fappaz Sep 02 '20 at 03:05
-
How you are converting 16bit raw data into png image? I am trying to generate a png from 16bit data return by api but no luck. I am struggling with it. Check jsfiddle with the sample raw data https://jsfiddle.net/mshariq/9xzk8uqb/9/ . Any help would be highly appreciated. Thanks! – Mohd. Shariq Mar 11 '22 at 12:14
1 Answers
4
No.
When drawn to a canvas the image is uncompressed, and all the pixels data are pre-multiplied and converted to 24-bit data + an 8-bit alpha channel (RGBA).
In this process the image looses everything from the original, even for same color depth original image because of various rounding errors (See Canvas fingerprinting.)
So even lossless formats are lossy on a canvas.
If you need the raw data, you'll need to write a parser yourself and treat directly your images files as arrayBuffer.

Mike 'Pomax' Kamermans
- 49,297
- 16
- 112
- 153

Kaiido
- 123,334
- 13
- 219
- 285
-
Agreed. But I have done some tests like converting 8bit Monochrome & RGB Images to PNG and rendering it to canvas. Then after extracting using 'getImageData' api gives 32 bit RGBa (raw image data). When compared with source raw Image (off course ignoring alpha channel in case of RGB and taking only one channel's pixel data in case of 8bit monochrome), it actually matched. However source raw image pixel values are integer only. Are there any chances that result image would be different in mentioned case? – Kalpesh Mahajan Apr 17 '17 at 09:39