user578219
user578219

Reputation: 617

Highlight Difference between two images

I saw some code to code to highlight the differences between two images in an answer to the following Stack Overflow question: Highlight differences between images. Also it has a link to a similar implementation: Resemble.js GitHub Page. I was trying to understand the implementation "ignore less" and "ignore antialiasing" option.

Basically, I have a scenario where an image is created on two different operating systems. The images could have a difference in resolution or the operating system itself, like Windows and Linux, could alter the image in some way. But overall the images are the same for human eyes. I want to find out if they are similar, say at least 80%.

Upvotes: 2

Views: 1367

Answers (1)

Assafs
Assafs

Reputation: 3275

The solutions you referred to show that you can compare two images of identical size. Since you're interested in comparing images of different resolution (yet same proportions), including ignoring some small differences to the human eye such as antialiasing, I suggest doing the following:

1) Reduce both images to an equal resolution. The more the scale-down, the rougher the comparison is, since you'll lose information. I suggest using 80% of the smaller image as the desired size for both images after the scale-down.

2) run the comparison pixel by pixel. You could look at the neighbouring pixels as well, to judge if the pixels are similar - and if their immediate environment is similar.

By comparing a scaled-down image, minute differences such as antialiasing will be removed/reduced in the scale-down process and will interfere less with the comparison. Since the standard you're hoping to beat is the human eye difference, this may be sufficient.

Upvotes: 1

Related Questions