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