Re: Image transformations

[Yuri Khan <yuri.v.khan@gmail.com>]

On Fri, Jun 14, 2019 at 7:53 PM Richard Copley <rcopley@gmail.com> wrote:

>     > Thirdly, the homogeneous matrix is compact and uniform, and makes
>     > it easy to compose and invert (undo) transformations.
>
>     So are/do the attributes.
>
> I think you're underestimating the difficulty of that part. Here's a concrete
> example. Suppose the user wants to apply two transformations,
>
> 1. Stretch by factor 2 in the x direction, then rotate clockwise by 45 degrees,
>    then translate to the right by 100 pixels.
>
> 2. Stretch by factor 0.5 in the x direction, then rotate clockwise by 90 degrees,
>    then translate left by 100 pixels.
>
> Calculating the resulting matrix might be a little tricky to get right, but with
> some experimentation you'll get there. Calculating the resulting shear,
> rotation, scale and translation is much more difficult to conceptualize. You
> would first have to calculate the matrix in any case. Then you would need to do
> Singular Value Decomposition.

If I were to propose a high-level format for describing
transformations in homogeneous coordinates, it wouldn’t be a flat
structure of rotation, shear, scale and translation. I’d suggest a
list of elementary transformations, taken in reverse order of
application, where each element can be one of:

* ('rotate phi)

  {{ cos(phi)  -sin(phi)  0 },
   { sin(phi)   cos(phi)  0 },
   {        0          0  1 }}

* ('scale s)  or ('scale sx sy)

  {{ s 0 0 },    {{ sx  0 0 },
   { 0 s 0 },     {  0 sy 0 },
   { 0 0 1 }}     {  0  0 1 }}

* ('skew ax ay)              or  ('skew ax)

  {{ 1        tan(ax)  0 },      {{ 1  tan(ax)  0 },
   { tan(ay)        1  0 },       { 0        1  0 },
   {       0        0  1 }}       { 0        0  1 }}

* ('translate dx dy)  or  ('translate dx)

  {{ 1 0 dx },            {{ 1 0 dx },
   { 0 1 dy },             { 0 1  0 },
   { 0 0 1  }}             { 0 0  1 }}

* and maybe, for users with advanced needs and a good understanding of maths,
  ('matrix a b c d tx ty)

  {{ a c tx },
   { b d ty },
   { 0 0  1 }}

(An attentive reader will notice that the above data model is lifted
almost verbatim from CSS Transforms.)