[Math] A controlled trapezoid transformation with perspective projecton

Question

I'm trying to implement a controlled trapezoid transformation in Adobe Flash's ActionScript using the built-in perspective projection facility. To give you an idea of how the effect looks like:

I've been searching for a solution for a few days now and, apart from the tessellation alternative which produces poor quality results, no one has tried to employ perspective projection to achieve this effect. It's maybe because it requires solving some math, which is something I hope you could help me with.

So Flash uses a simple frustum model with a viewpoint, projection plane, and focal length, which is the distance from the viewpoint to the projection plane.

(Source)

There is also fieldOfView but it should be of no importance as its meaning appears to be overridden by focalLength (at least it's value makes no difference in my ActionScript experiments as long as the focal length is specified).

The rectangular piece of graphics is located right on the projection plane so that the middle point of its top edge is located in the projection center. To achieve the effect, the rectangle is rotated by some angle.

The question is, what should be the values of focal length and angle so that new height and new bottom width satisfy some given values that are desired for the effect? Or speaking mathematically:

Given:

• a frustum with focal length
• a rectangle with its width and height, which is pinned to the projection plane (z=0) of so that the midpoint of the rectangle's top edge is located right in the projection center of the frustum
• the needed new height and new bottom width of the rectangle after it's rotated and projected onto the projection plane

Unknowns to be found and applied to the perspective projection in order to get the desired new height and new bottom width:

• the focal length of the frustum
• the angle of rotation

If I missed out any other parameters or added any redundant ones, please correct me.

Also, is it possible to control the effect just by the angle with which the sides of the rectangle should be projected on the projection plane (the angle between the projected rectangle's side and its top edge) provided that the new height remains some constant value?

Answer 1

Grabbed a pencil, piece of paper, and Maple and solved it by myself.

var eqRoot:Number = -Math.sqrt(newBottomWidth*newBottomWidth*oldHeight*oldHeight - newHeight*newHeight*oldWidth*oldWidth);
var focalLength:Number = Math.abs(eqRoot/(newBottomWidth - oldWidth));
var angle:Number = Math.atan2(eqRoot/(newBottomWidth*oldHeight), newHeight*oldWidth/(newBottomWidth*oldHeight));
var angleDeg:Number = angle*180/Math.PI;