javascript - 在 Canvas 中从 Canny 边缘检测创建形状

Question

有人知道如何从 Canvas 中的 Canny Edge Detection 创建形状吗？

Answer 1

我在这里假设您已经根据问题的制定方式实施了 Canny 边缘检测-

您可以使用这样的方法（用 Java 编写，但应该很容易翻译成 JavaScript）和/或可能使用一些有限的线拟合方法（统计）。

本质是您必须找出连接了哪些像素，并根据边缘检测的结果自己创建多边形对象/数组。

一旦你有连接的像素，你可以使用点减少算法，如Ramer–Douglas–Peucker算法（此处为 JavaScript 实现）来避免多边形包含相似斜线的每个单点等。

您将遇到各种挑战，例如由于原始图像中的噪声过多或“弱线”导致的短分段线，“线”簇，这使得很难找出如何将它们连接为多边形。

Answer 2

我不知道有任何图书馆，但是你可以：

• 用于getImageData()访问像素数据的字节[]
• 在该数据之上实现您自己的卷积过滤器（这方面的示例可能在线存在）

通过这种方式，您可以找到高对比度的区域（边缘）。

编辑我同意肯的观点——我可能误读了这个问题。

除了 Ken 的回答之外，如果您知道您正在寻找什么样的形状，那么您可能想看看Hough 变换，它非常适合检测线、椭圆和其他可以仅使用几个参数进行几何定义的形状.