画布：在图像中查找卡片的角落

Question

我的目标是从图像中提取任何卡片..

说明：

我最初有以下图像...

将它画在画布上并应用精明的边缘检测并得到这个..

我希望得到的结果应该类似于：

要从图像中提取卡片，我需要找到卡片的角。

或

我在网上找到的另一种方法是：

1. 遍历所有边，找到闭合的边，然后

2. 找到最大的闭合边并进行相应的裁剪。

但我在尝试构建任何逻辑来实现任何方法时变得一无所知。

这样做是为了进行边缘检测，但无法继续进行：

var img = new Image();
img.src = "bcard.png";
img.onload = function() {
    var canv = document.getElementById("canv");
    var ctx = canv.getContext("2d");
    canv.height = img.height;
    canv.width = img.width;
    ctx.drawImage(img,0,0);
    window.canny = CannyJS.canny(canv); //included a js script to do canny edge detection
    canny.drawOn(canv);

}

Answer 1

首先，我从提供的图像中提取了红色通道。

红色通道图像：

接下来我使用高斯模糊对其进行模糊处理。

图像模糊：

最后，我进行了边缘检测，得到以下结果。

最终边缘：

为了完美地裁剪卡片，您只需要找到 ONE 外轮廓。为此，您需要放大生成的图像

放大图像：

现在你必须找到轮廓。找到存在的外部轮廓。在这种情况下，您只会找到一个轮廓。围绕这个轮廓画一个边界矩形。

使用边界矩形的坐标，裁剪图像：

（我在 python 中有生成的脚本，但我看到你已经用 javascript 编写了代码）