# Canny edge detector

**URL:** <https://discourse.processing.org/t/canny-edge-detector/24282>\
**Category:** Gallery\
**Created:** [October 2, 2020, 12:55am UTC](https://discourse.processing.org/t/canny-edge-detector/24282 "2020-10-02T00:55:19Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![paulgoux](https://avatars.discourse-cdn.com/v4/letter/p/b9bd4f/32.png) [@paulgoux](https://discourse.processing.org/u/paulgoux)\
**Post date:** [October 2, 2020, 12:55am UTC](https://discourse.processing.org/t/canny-edge-detector/24282/1 "2020-10-02T00:55:19Z")

</div>

Just posting if anyone is interested this is a canny edge detector. Please note it is not fast will take a few seconds for large images. I will try and implement it using different data structure and then using shaders to see what speed improvements I can make, however this was a proof of concept as I could not understand the traditional canny algorithm or how to implement it even after lengthy reading.

Here are some example pictures

without preprocessing

![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/0/0a0386e24cdf0be74324eb472dd81d655b298fdf.png) ;

![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/d/dfea8ffeaabc2df34f2b32a529e80e7317c67637.png)

![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/9/991b5b61e2ea3630163950ae29a0deb12936aecb.png)

![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/b/b1a39070528a5f077220ef3f059ac176f0c2fc8f.png)

with preprocessing

 ![Screen Shot 10-02-20 at 01.42 AM](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/9/9a700fe9c0ff176413e4ce1d0e7db58064c7e8f5.jpeg)

 ![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/f/f9add515975689126068de189b277377426df573.png)

still a few improvements such as trimming short lines and adding vertex calculations

> **[paulgoux/canny](https://github.com/paulgoux/canny)**
>
> an attempt at canny detection. Contribute to paulgoux/canny development by creating an account on GitHub.

---

<div class="post-metadata">

**Author:** ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)\
**Post date:** [October 2, 2020, 11:25am UTC](https://discourse.processing.org/t/canny-edge-detector/24282/2 "2020-10-02T11:25:59Z")

</div>

Great work. Could you place a link to the original colored photo? (S10.jpg)

---

<div class="post-metadata">

**Author:** ![paulgoux](https://avatars.discourse-cdn.com/v4/letter/p/b9bd4f/32.png) [@paulgoux](https://discourse.processing.org/u/paulgoux)\
**Post date:** [October 2, 2020, 9:11pm UTC](https://discourse.processing.org/t/canny-edge-detector/24282/3 "2020-10-02T21:11:27Z")

</div>

> **[Edge detection | Wikiwand](https://www.wikiwand.com/en/Edge_detection)**
>
> Edge detection includes a variety of mathematical methods that aim at identifying points in a digital image at which the image brightness changes sharply or, more formally, has discontinuities. The points at which image brightness changes sharply are...

scroll down just a touch

---

<div class="post-metadata">

**Author:** ![paulgoux](https://avatars.discourse-cdn.com/v4/letter/p/b9bd4f/32.png) [@paulgoux](https://discourse.processing.org/u/paulgoux)\
**Post date:** [October 3, 2020, 1:26am UTC](https://discourse.processing.org/t/canny-edge-detector/24282/4 "2020-10-03T01:26:57Z")

</div>

improved high contrast detection, but now its broken with low contrast  
new result

 ![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/3/331f4723bfee6cb5f897cf81719f9e536da91046.png)

 ![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/7/75881ca577f69c744b53eae088a55f412d8bee09.png)

will update github once fixed

---

<div class="post-metadata">

**Author:** ![paulgoux](https://avatars.discourse-cdn.com/v4/letter/p/b9bd4f/32.png) [@paulgoux](https://discourse.processing.org/u/paulgoux)\
**Post date:** [October 4, 2020, 10:29pm UTC](https://discourse.processing.org/t/canny-edge-detector/24282/6 "2020-10-04T22:29:16Z")

</div>

Ok finished, code has been significantly trimmed. and now comes with 4 different modes.

mode 4

 ![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/b/b7c580482e29b31a2530f89442ce12a906669fac.png)

mode 3

 ![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/0/043f4ce1af3500491ee3127f9efeab0de50d859e.png)

mode 2

 ![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/e/e19a3af1f958abe43f243717f603116486a06b9b.png)

mode 1

 ![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/e/e60bbf5740bc1ed54c2a8079b11ac7e72109011a.png)

mode 0

 ![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/7/77259ed301526c38be1ec1376ed258a0f3041aa7.png)

with regular images.

reference  
 ![b3](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/a/a6e648a4b75f7f794ac7f3b07e78a5164626a093.jpeg)  
sobel

 ![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/f/f35377ea637ceaaf7e032c234794cd1a8ad826e7.jpeg) ![b3|640x480]

mode 0

![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/0/0dec8df31f22940d9978e9d0cd9ccb0871c9e45f.png)

mode 1

![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/1/1ae4093af0e483624934ff8c32505a7fdd64244b.png)

mode 2

![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/6/6aafdb4b20847a239e0c3a20c0552458038e89b7.png)

mode 3

![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/2/2114984cc36bddd4d2c6a45868bd90cbb9639851.png)

mode 4

![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/0/0aa152f64dd8519fcc67b688fde07f554e11a688.png)

github will be updated later.