如何使用JavaScript修复图像透视失真和旋转？

Question

我有一些使用手机拍摄的照片。是否有任何JavaScript库可以拉直纸张的照片并将其展平？例如，我想创建一个矩形图像，没有任何图像失真。

换句话说我想知道如何使用JavaScript修复透视失真和旋转？

例如，我在this文章中找到了以下示例图片：

如何使用javascript修复此类图像？

Answer 1

看起来https://www.npmjs.com/package/perspective-transform正是您要找的。

  

使用反向

创建函数以将点从一个任意四边形映射到另一个四边形，反之亦然

Answer 2

JSFeat可以为您做到这一点。甚至还有透视失真的例子。您必须自己添加/计算源点和目标点。

Answer 3

不需要任何额外的npm包，这可以通过创建不规则的裁切框来实现，首先将图像加载到画布中，应在图像上调整4个裁切点，然后将其放入规则的矩形画布中。

点击此链接以获取详细的代码和步骤Image Perspective correction using javascript and opencv

这是演示

let dst = new cv.Mat();
let dsize = new cv.Size(imageHeight, imageWidth);
let srcTri = cv.matFromArray(4, 1, cv.CV_32FC2, pointsArray);
let dstTri = cv.matFromArray(4, 1, cv.CV_32FC2, [0, 0, imageHeight, 0, imageHeight, imageWidth, 0, imageWidth]);
let M = cv.getPerspectiveTransform(srcTri, dstTri);
cv.warpPerspective(src, dst, M, dsize, cv.INTER_LINEAR, cv.BORDER_CONSTANT, new cv.Scalar());
document.getElementById('imageInit').style.display = "none"
cv.imshow('imageResult', dst);