svg transformations help

[go2ghana]

Hi to all,
while working on a lightweight svg editor implemented as firefox extension
I ran into problem and now  need some help to understand the
fundamentals of nested svg transformations.
The basic matrix concatenations work well but when I start to rotate an
element which already has a skew
transform applied I got it working well only if I prepend the rotation
matrix to the transform... so far good
but rotate an element which resides inside of a group things get more
complicated.
I tried with inkscape and found it will apply a matrix and also change
the width and height and even the stroke-width
 of the rect I used for testing like:
  <g
     transform="translate(100,100) skewY(10) skewX(25)"
     id="g15">
    <rect
       id="skewPath23"
       x="-222.08493"
       y="237.81218"
       onclick="incrementTransform(this)"
       width="138.00793"
       height="101.14107"
       transform="matrix(0.8490597,-0.5282969,0.9708449,0.2397086,0,0)"
       
style="fill:#ff0000;fill-opacity:0.5;stroke:#330000;stroke-width:0.35443538"
/>
  </g>

works well but how to understand?
Is anyone able to explain how this is implemented?

Cordially,
Axel

------------------------------------------------------------------------------
_______________________________________________
Inkscape-devel mailing list
Inkscape-devel@...
https://lists.sourceforge.net/lists/listinfo/inkscape-devel

[Thomas Holder-3]

Hi Axel,

> ... but rotate an element which resides inside of a group things get
> more complicated. I tried with inkscape and found it will apply a
> matrix and also change the width and height and even the stroke-width

width and height and stroke-width won't change if you set "Store
transformation = Preserved" in Inkscape Preferences.

Concerning transformations inside groups: Let A be the transform matrix
of an object and B the accumulated transformations of all its parent
groups. The absolute transformation of the object is

   T = B * A

Now you want to transform this object by matrix C, gives you

   T' = C * T
      = C * B * A
      = B * B.inverse * C * B * A
      = B * A'

with

   A' = B.inverse * C * B * A

That's it :-)

Regards,
   Thomas

------------------------------------------------------------------------------
_______________________________________________
Inkscape-devel mailing list
Inkscape-devel@...
https://lists.sourceforge.net/lists/listinfo/inkscape-devel