# When you skew an ellipse, how do you calculate the angle of rotation and the new axis lengths

I'm trying to write a SVG drawing program, and it is necessary to render skewed ellipses as rotated ellipses with correctly recalculated axis lengths. This shows the problem I'm trying to solve:

The dark blue points are easily calculated from the skew geometry. I know the center of the new ellipse, but I don't know how to calculate the angle of rotation of the new ellipse and its new axis lengths. I did this by eye in a drawing program, but I need to do this mathematically in my code.

Doable, but the result is a bit messy.

First, observe that the pictured transformation is equivalent to a shear that leaves the center of the ellipse fixed followed by a translation. Translations don’t affect the shape or orientation of an ellipse, so we can simplify things a bit by considering an ellipse in standard position and a shear that fixes the origin.

A general equation for an ellipse centered on the origin is $Ax^2+Bxy+Cy^2=1$, which can be written in vector form as $$\mathbf x^T\begin{bmatrix}A&\frac B2\\\frac B2&C\end{bmatrix}\mathbf x=1.$$ For an ellipse, the eigenvalues of this matrix are both positive. If $\lambda_1$ and $\lambda_2$ are these eigenvalues, with $\lambda_1\le\lambda_2$, then the semimajor and semiminor axis lengths of the ellipse are given by $a^2=1/\lambda_1$ and $b^2=1/\lambda_2$, respectively. The related eigenvalues point in the directions of these axes, so the rotation of the ellipse is given by the angle of the line defined by the eigenspace of $\lambda_1$. Solving for the eigenvalues, we get $$\lambda_{1,2}=\frac12\left(A+C\mp\sqrt{(A+C)^2+B^2-4AC}\right)\tag{1}$$ with associated eigenvectors $$\left[A-C\mp\sqrt{(A+C)^2+B^2-4AC},B\right]^T.\tag{2}$$ (You can check that these two vectors are orthogonal.)

In this case, we start with the ellipse $x^2/a^2+y^2/b^2=1$, or in vector form $\mathbf x^T\mathbf Q\mathbf x=1$, with $\mathbf Q=\operatorname{diag}(a^{-2},b^{-2})$. The equation of the transformed ellipse is obtained by substituting $\mathbf S^{-1}\mathbf x$ for $\mathbf x$, where $\mathbf S$ is the matrix of the shear transformation:$$\mathbf S=\begin{bmatrix}1&\tan\beta\\0&1\end{bmatrix},$$ i.e., $(\mathbf S^{-1}\mathbf x)^T\mathbf Q(\mathbf S^{-1}\mathbf x)=\mathbf x^T((\mathbf S^{-1})^T\mathbf Q\mathbf S^{-1})\mathbf x=\mathbf x^T\mathbf Q'\mathbf x$. (Note that inverting $\mathbf S$ is a simple matter of replacing $\tan\beta$ with $-\tan\beta$.) Multiplying this out, we get $$\mathbf Q'=\begin{bmatrix}\frac1{a^2}&-{\tan\beta\over a^2}\\-{\tan\beta\over a^2}&\frac1{b^2}+{\tan^2\beta\over a^2}\end{bmatrix}.\tag{3}$$ Substitute these values for $A$, $B$ and $C$ in equations (1) and (2) to find the semi-axis lengths and rotation of the transformed ellipse. (Instead of doing all of this, you could have looked up formulas for the semi-axis lengths and rotation of a general-form ellipse in sources such as Wikipedia, but it’s not very difficult to work it out for this relatively simple case.)

For example, let’s say that for your ellipse, $a=4$, $b=2$ and, as in the illustration, $\beta=\frac\pi6$. Substituting these values into $\mathbf Q'$ we get $A=\frac1{16}$, $B=-\frac1{8\sqrt3}$ and $C=\frac{13}{48}$. Plugging these coefficients into equation (1) produces ${4\mp\sqrt7\over24}$ for the eigenvalues, which gives (after a bit of work) $\frac2{\sqrt3}(\sqrt7\pm1)$ (i.e., approximately $4.21$ and $1.90$) for the semi-axis lengths and $\arctan\left({2\sqrt{21}-5\sqrt3\over3}\right)\approx9.55°$ for the ellipse’s rotation.

As a sanity check, observe that the shear transformation $\mathbf S$ has determinant $1$, so $\det{\mathbf Q'}=\det{\mathbf Q}=(ab)^{-2}$. But the determinant of a matrix is equal to the product of its eigenvalues, so the product of the semi-axis lengths of these ellipses is constant. If we multiply the semi-axis lengths of the transformed ellipse computed in the previous paragraph together, we indeed get $8=4\cdot2$.

It’s interesting to plot these values as functions of the shear angle $\beta$. The semi-axis lengths are monotonic, as one might expect, but the rotation angle reaches a maximum—at around $60°$ of shear for the above example—and then decreases as the shear angle is further increased.

Addendum: It turns out that the peak rotation angle is achieved when the shear angle $\beta$ satisfies $\tan\beta={\sqrt{a^2-b^2}\over b}=\frac fb$, where $f$ is the distance of the foci from the center of the original ellipse. This quantity is also known as the second eccentricity of the ellipse and the corresponding angle its angular eccentricity.

• Referring back to the original shear transformation, maximum rotation occurs when the new center coincides with one of the original foci. – amd Dec 23 '16 at 18:43
• I am beginning to think that the math is so complex, that a newton method search for the solution based on calculating the distance between the known center and the calculated new points will find both of the angles and radii. I'm a bit rusty in my math, used to do partial differentials all the time when I was working as an engineer, but finding this a bit hard to wrap my head around to turn into code. – GeeWhizBang Dec 28 '16 at 12:02
• @GeeWhizBang I’ve done the math for you. All that’s left to do is to turn the three numbered formulas into code. Seems pretty straightforward to me. – amd Dec 28 '16 at 19:15
• I really don't know what you mean by the formulas for eigenvalues and the matrix. It may be obvious to you, but I don't know what the matrix in equation 3 means code wise. For example, what is the meaning of "T" in equation 2? Is there some place that will explain this syntax so I know what it means? – GeeWhizBang Dec 29 '16 at 20:51
• @GeeWhizBang The superscript $T$ stands for “transpose,” which in that case simply makes what’s written as a row vector into a column vector. Compare $Q'$ to the general matrix above equation (1): $A=1/a^2$, $B/2=-\tan\beta/a^2$, $C=1/b^2+\tan^2\beta/a^2$. Plug that into the other equations. I hope you at least know how to get the slope or angle of a vector. Work through the example that I gave for yourself to see how to put it all together. – amd Dec 30 '16 at 6:36