Gallery
Instagram
Flickr
Pinterest
DaveCOLLIER
DevelopmentPages
Canny Edge Detection
classic standard edge detection
Description
Canny Edge Detection. The formulas developed by John F. Canny in 1986. It’s the kind of standard for edge detection in images. This page uses the software from Open Source Computer Vision for producing a Gaussian blur on the image and for calculating Canny results. It uses my own formulas for calculating greyscale as there are various options for this.
Canny took a computational approach to edge detection, which is all very well, but that isn’t how the brain does it. Someone doing a line drawing – which is essentially a graphic representation of edge detection – would produce something that looks very different from the outputs from a Canny formula.
There’s a reason for this. Canny is producing computational edges, determined by the difference between the brightness (i.e. level of greyscale) of a pixel and its surrounding pixels. The eye, by contrast is working on a perceptual image. That cannot be calculated solely from a mathematical formula.
Perceptual images are tricky to compute because there are many factors involved not least cultural norms of perception, so it is probably early days. It will doubtless come though, once some academic thinkers start to realise it and take it on.
Typically the Canny calculations require the image to be converted to greyscale first. They shouldn’t do, the calculations can easily work out the brightness level of each pixel on the fly, that’s what most of my scripts in this website do. There is also the question of what type of greyscale, see my page Greyscale is another way of saying Brightness. I don’t know how much difference using a different greyscale formula will make. Possibly not much in the scheme of things. Still. it would be useful to know.
The Canny procedures then require a Gaussian blur to be applied to the image. In order to get edges, the image has first to be made blurry. The reason is that the Canny formula is based on gradients, and making an image a bit fuzzy improves the gradients. The effect is to reduce some of the unwanted lines you get if you do the calculation without a Gaussian blur, as you can see on this page by trying with and without.
What does make a lot of difference, is the parameters used by the Canny formulas. You can try those on this page, the lines you get, i.e. edges that are identified, can be very different, depending on the parameters.
It’s probably clear that I am not convinced by the Canny formulas for edge detection. They do work, kind of, but I wonder how much this is by coincidence as much as anything. I know that J. F. Canny has written papers on why his formulas work, though I’ve noticed that other methods of determining relative difference in brightness between adjoining pixels work pretty well too, as evidenced on some of the pages on this website. And I doubt that anything really convincing is going to come forth until consideration is given to the topic of perception.
or alternatively image url apply
  – see copyright notice
-% done - patience! large files can take a while. 
......
This page requires HTML5 – and Javascript your browser version is too old for this page to work for you or you have Javascript switched off.
Formula for calculating greyscale:
Include Gaussian Blur
Gaussian Kernel Matrix Width
Gaussian Kernel Matrix Height
Gaussian Kernel Standard Deviation x axis
Gaussian Kernel Standard Deviation y axis
Hysteresis Threshold 1
Hysteresis Threshold 2
aperture size for the Sobel operator
use complex gradient formula
Image Rendering:
Auto
Crisp Edges
Smooth
High Quality
Pixellated
Image rendering is controlled via CSS. The options are CSS image-rendering variables, some of them produce identical results to others in some cases.
Image Smoothing Enabled on Paint
Convert from standard Canny grey on black to translucent dark lines on a transparent background
Line colour        
set line colour:
Paint Result