Hough Circle detection Demo

With this online tool you can experiment with Hough Circle detection algorithm.


Hough Circle Transform App


Elapsed: 0


User Interface

Select media source

You can apply the Hough conversion to different image sources. Use the buttons below to select media source:

  • Browse button – click to select an image from your computer.
  • Camera button – activate your web-camera and apply computer vision filters directly on it.

Note that supported media format depends on your browser capabilities.

Configure the filter

The Hough testing tool has the following UI controls to help configure the filter:

  • Size – the slider controls the radius of the detection circles
  • Sigma– this slider defines the gaussian blur strength

How does Hough demo works?

The following steps describe how the Hough detector demo works:

  • The tool loads an image into GPU memory using HTML Canvas element.
  • The second step is to apply a WebGL shader for Hough circle detection
  • As a next step, the algorithm makes a generic non-maximum suppression. In this way we extract the points with a high probability of circular shapes.
  • Finally, the app draws circles at the points that are of sufficient intensity

Related algorithms and code

Image Analysis Demo Gallery