How can I detect if a picture is blurry with Javascript?

Question

I have a jpeg data url in a javascript string. Is there a way I can detect the "blurriness" of the picture? The pictures come from a video that is being processed in-browser.

I understand that it isn't simple, and there is no definitive standard of blurriness, yet is there a way to measure blurriness?

Usually you would look for high frequency content in the autocorrelation (power spectrum). The lower the high frequency content, the blurrier the image. — Floris, Aug 06 '13 at 18:14
you should use more powerful language for this (c++ lets say). this will help you start http://stackoverflow.com/questions/7765810/is-there-a-way-to-detect-if-an-image-is-blurry — pregmatch, Aug 06 '13 at 18:20
@sgroves no, the images are end user generated with no guaranteed good versions. — Matt Votsikas McLean, Aug 06 '13 at 18:51
@pregmatch Thanks, I'm aware of other tools available to do this already, I'm just wondering if this has been done in-browser yet. It would save alot of server side processing if the check if the images are ok in the browser — Matt Votsikas McLean, Aug 06 '13 at 18:53

score 4 · Answer 1 · answered Jan 07 '17 at 21:10

4

There are several approaches to blur detection, I implemented a really simple one once and wrote this blog post about it: http://www.codeoclock.com/2015/06/05/blur-detection-javascript/

Code can be found here: https://github.com/timotgl/inspector-bokeh

The algorithm isn't very refined, but I was able to detect images with a lot of blur somewhat reliably.

answered Jan 07 '17 at 21:10

timotgl

1,961
8
16

A simple test with this blurry image https://www.facebook.com/postcardnow/photos/a.115486162502141.1073741828.110080529709371/130127087704715/ shows a Blur score of 0.36. Your library may have to be improved! – Tim Long Nov 10 '17 at 11:26
2

@TimLong Yes it's experimental. Feel free to tune the algorithm and contribute on GitHub. I'm not actively maintaining the project. – timotgl Dec 08 '17 at 12:08

How can I detect if a picture is blurry with Javascript?

1 Answers1