边缘检测结合Floodfill算法图像处理

时间:2013-01-25 20:31:57

标签: image html5 image-processing canvas

好的,我正在寻找一个用于图像处理的区域填充工具,我希望将边缘检测与洪水填充算法结合起来。我已经研究了不同类型的算法(canny,laplace sobel等),但不了解如何实现它们并根据我的具体情况进行调整。

我已经能够使用以下的html5rocks示例: -

http://www.html5rocks.com/en/tutorials/canvas/imagefilters/

并可以将其应用于我的图像数据。我也可以在我选择的图像中应用一种新颜色,但我不确定如何将2组合在一起以便我可以执行以下操作 -

对图像中的区域进行mousclick并用新颜色替换旧颜色,在由鼠标点击周围的边缘检测过滤器和原始颜色定义的边缘定义的区域内(我打算尝试使用给定容差内的原始颜色HSL值)< / p>

如此有效地像智能区域填充。

它正在使用HTML5画布和javascript。

希望这是有道理的......

1 个答案:

答案 0 :(得分:2)

为了使用图像处理算法,我建议你从matlab开始。如果你真的想了解这是怎么做的。
这是一个免费的图像处理课程https://class.coursera.org/images-2012-001/auth/welcome?type=logout&visiting=https%3A%2F%2Fclass.coursera.org%2Fimages-2012-001%2Fclass%2Findex

function [ output_args ] = SobelEdgeDetection( Image )

maskX = [-1 0 1 ; -2 0 2; -1 0 1];
maskY = [-1 -2 -1 ; 0 0 0 ; 1 2 1] ;

resX = conv2(Image, maskX);
resY = conv2(Image, maskY);

magnitude = sqrt(resX.^2 + resY.^2);
direction = atan(resY/resX);
thresh = magnitude < 101;
magnitude(thresh) = 0;
showImage(magnitude);

end

这是我写的sobel边缘检测功能的一个例子。你需要了解什么是卷积,你在哪里使用它。

如果您只想使用它。我建议你探索http://www.pixastic.com/lib/docs/actions/edges/和其他图像处理。对于每个图像,您需要了解如何设置正确的值。