CODEWITHSUNDEEP
javascriptimage-processingcanvas
akonsu
akonsu

Reputation: 29536

looking for algorithm to find boundary of color region

I have a canvas with image drawn to it.

When the user clicks on the image, I need to find the color region that the user clicked on. A region is defined as a set of 4-way connected pixels with the same color as the pixel that was clicked on.

I need the region in a form that I could use to set a clipping path on the canvas, so that I could fill the area with, say, a gradient, etc.

Are there efficient algorithms for finding a boundary? Something more optimal than flood fill algorithms (I do not need to fill, I just need to find a path around my region).

Upvotes: 6

Views: 2755

Answers (1)

Xenethyl
Xenethyl

Reputation: 3199

I believe the Moore Neighborhood tracing algorithm will do what you want. By definition, the Moore Neighborhood looks at 8-connectedness, but you should be able to easily adjust it to 4-connectedness. Your resulting regions will most likely be better if you test for 8-connectedness, but your application may have specific requirements.

Wikipedia has a good outline of the algorithm here. I've worked with this in the past and had great success--it's very fast.

Upvotes: 4

Related Questions