如何将 OpenCV GetPerpectiveTransform 矩阵转换为 CSS 矩阵？

Question

我有一个来自 Python Open-CV 库的矩阵：

M = cv2.getPerspectiveTransform(source_points, points)

但它与CSS 变换矩阵完全不同，尽管它具有相同的形状，但我认为 open-cv 会根据数字的比例和倾斜度对 x 和 y 进行某种其他转换。 示例：我在源点（绿色）和目标点（橙色）中有一个图像

使用cv2.getPerspectiveTransform(source, target)我得到矩阵：

array([[ 7.45735546e-01, -8.09538161e-02,  1.02930118e+01],
       [-4.69040997e-01,  8.60285055e-01,  7.66245963e+01],
       [-6.90849647e-04, -3.31231543e-04,  1.00000000e+00]])

最后cv2.wrapPerspective我得到了我的形象：

但如果我尝试使用 CSS 变换的相同矩阵，使用齐次矩阵transform: matrix(0.74574, -0.46904, -0.08095, 0.86029, -88.57274000000001, -102.30782)和 cv2 矩阵的相同值我得到：

我试图搜索getPerpectiveTransform算法，但我只是找到了有关如何使用它的示例。 我缺少什么？

Answer 1

我借助计算 CSS matrix3d解决了它。 结果矩阵与cv2.getPerspectiveTransform相同，您必须将其与transform:matrix3d和 transform-origin:-left px -up px 一起使用。

左上像素是负左上角的原点，因为原点位于 0,0 并且您正在减去原点角