How to Create a Diff of Two Images
When I was a child, I loved looking for Waldo in the “Where’s Waldo?” book series. These days I’m a sucker for TMZ’s “What’s the Big Frigin Difference” images, where TMZ slightly changes an image and you have to spot the differences between the two. That got me to thinking — how easily could I automate diff’ing two images? This StackOverflow post was gold.
To create a diff of two similar images, we’ll use ImageMagick’s convert
command line utility with a large host of configurations:
convert '(' image1.png -flatten -grayscale Rec709Luminance ')' \ '(' image2.png -flatten -grayscale Rec709Luminance ')' \ '(' -clone 0-1 -compose darken -composite ')' \ -channel RGB -combine diff.png
How effective is this command with its configuration arguments? Let’s have a look:
Contents
Original Image
Modified Image
Diff’ed Image
The diff image result is pretty informative! The size of the sunglasses is clearly presented, and if you look closely, you can see one skull at the top-right of the shirt has been flipped.
Whatever your reason for wanting to identify the difference two images, ImageMagick’s convert
tool is impressive. You can do a million things with ImageMagick; check out my Media tutorials to learn more awesome ways to modify images, videos, and audio!
Create a CSS Cube
CSS cubes really showcase what CSS has become over the years, evolving from simple color and dimension directives to a language capable of creating deep, creative visuals. Add animation and you’ve got something really neat. Unfortunately each CSS cube tutorial I’ve read is a bit…
How I Stopped WordPress Comment Spam
I love almost every part of being a tech blogger: learning, preaching, bantering, researching. The one part about blogging that I absolutely loathe: dealing with SPAM comments. For the past two years, my blog has registered 8,000+ SPAM comments per day. PER DAY. Bloating my database…
Full Width Textareas
Working with textarea widths can be painful if you want the textarea to span 100% width. Why painful? Because if the textarea’s containing element has padding, your
"width:100%"
textarea will likely stretch outside of the parent container — a frustrating prospect to say the least. Luckily…
[ad_2]
Source link