如何竞争将矩形转换为梯形所需的转换矩阵? [英] How do I compete the transformation matrix needed to transform a rectangle into a trapezium?

问题描述

我正在使用css转换和IE中的等效过滤器，并希望通过将2d矩形转换为梯形来模拟视角.

I'm playing around with css transforms and the equivalent filters in IE, and want to simulate perspective by transforming a 2d rectangle into a trapezium.

具体来说，我希望矩形的右手边保持相同的高度，而左手边要说是高度的80％，以便使两边的中点彼此水平对齐.

Specifically, I want the right hand side of the rectangle to stay the same height, and the left hand side to be say 80% of the height, so that the mid points of both sides are horizontally in line with each other.

我熟悉矩阵代数，但不知道如何确定将由哪个矩阵来做.

I'm familiar with matrix algebra, but can't think how to determine what matrix will do that.

推荐答案

对于投影，我将使用4x4矩阵:

For projection, I'd use a 4x4 matrix:

1    0    0    0
0    1    0    0
0    0    0    0
0    0    1/d  1

这适用于齐次坐标(在标准透视图设置中，d是眼睛到投影平面的距离).

This works on homogeneous coordinates (d is the distance of the eye from the projection plane, in a standard perspective setup).

替代:

为避免使用均质坐标(或者如果您不能使用4x4矩阵，或者无论如何您都不能使用硬件加速来进行矩阵转换)，只需使用以下方法即可:

To avoid working with homogeneous coordinates (or if you can't use 4x4 matrixes, or if you can't use hardware acceleration for matrix transformation anyway), just use this:

x' = (d*x)/(z+d)
y' = (d*y)/(z+d)
z' = 0 (it's always projected onto the projection plane)

顺便说一句，这基本上也回答了您的梯形问题.只需将您的矩形正确地放置在3D空间中，就不难发现:想象一下在您右侧墙上的矩形画.然后降低视点，使其与绘画底部平齐.现在，它将被投影为您的梯形.

这篇关于如何竞争将矩形转换为梯形所需的转换矩阵?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！