CODEWITHSUNDEEP
image-processinghtml5-canvas
Tarun Kumar
Tarun Kumar

Reputation: 51

what does each pixel value represent in noise reduction algorithm for digital image processing, when applied to HTML5 canvas?

I am trying to apply Noise reduction algorithm using HTML5 canvas. I read the median algorithm on http://blog.kleinproject.org/?p=588 . It says find the median of the all the neighboring pixels of each pixel and replace that pixel value with that median value. According to that algorithm if we have the following matrix of neighboring pixels for a pixel having value 200

82 81 82
81 200 83
80 83 84

It will have ordered list like

80 81 81 82 82 83 83 84 200

and median will be 82. So replace 200 with 82 which will give

82 81 82
81 82 83
80 83 84

HTML5 canvas treats each pixel value as RGBA components. There is no single value for a pixel. Now what value should I choose while applying this algorithm . Should it be the average of all three RGB values or is there any other function to map to a single value?

Upvotes: 0

Views: 531

Answers (1)

Tanzeel Kazi
Tanzeel Kazi

Reputation: 3827

When dealing with RGB values, you will need to calculate the median for each colour component and replace it in the corresponding colour component of the final RGB value accordingly. This is true for any colour image (or rather pixel with RGB representation) and not just HTML 5 canvas elements. The article you have linked to has stated the same explicitly (though in a slightly different context).

For the case of color images, the transformation above must be applied to the matrices R, G and B that compose each image.

Upvotes: 0

Related Questions