SVG po raz kolejny, tym razem pytam o 'transform' i 'matrix'

Bry :)

Mam problem ze zrozumieniem atrybutu transform dla path w svg. W moim pobranym z sieci i zmodyfikowanym przeze mnie svg jest coś takiego (klawisz enter po zaokrągleniu rogów, dzięki pomysłowi @m31 : ):

<path id="kbmp-etr" d="M 1003 241 L 1003 283.8 A 5 5 0 0 0 1008 288.8 L 1031.6 288.8 A 5 5 0 0 1 1036.6 293.8 L 1036.6 357.8 A 5 5 0 0 0 1041.6 362.8 L 1101.6 362.8 A 5 5 0 0 0 1106.6 357.8 L 1106.6 229.8 A 5 5 0 0 0 1101.6 224.8 L 1008 224.8 A 5 5 0 0 0 1003 229.8 Z" transform="matrix(.56176 0 0 .56176 14.838 17)" stroke-width="2"/>

Jakaś macierz, ale za Chiny nie rozumiem tego :P

Jak zmodyfikować ten transform aby móc przesunąć obrazek w wybraną stronę? o_O

Dzięki
M :)

https://en.wikipedia.org/wiki/Transformation_matrix
https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/transform
http://tutorials.jenkov.com/svg/svg-transformation.html
https://www.w3.org/TR/SVGTiny12/coords.html

Dzięki. Już kumam. znalazłem takie coś:
http://smurf.mimuw.edu.pl/external_slides/Przeksztalcenia_geometryczne/Przeksztalcenia_geometryczne.html

Czyli ustawiam główną przekątną na 1 a ostatnia kolumna i jej pierwsze dwie wartości określają przesunięcie. Dzięki! :)

PS. Adaptując to do mojego przypadku, wystarczyło zmodyfikować ostatni parametr, którym jest przesunięcie Y:

<path id="kbmp-etr" d="M 1003 241 L 1003 283.8 A 5 5 0 0 0 1008 288.8 L 1031.6 288.8 A 5 5 0 0 1 1036.6 293.8 L 1036.6 357.8 A 5 5 0 0 0 1041.6 362.8 L 1101.6 362.8 A 5 5 0 0 0 1106.6 357.8 L 1106.6 229.8 A 5 5 0 0 0 1101.6 224.8 L 1008 224.8 A 5 5 0 0 0 1003 229.8 Z" transform="matrix(.56176 0 0 .56176 14.838 14)" stroke-width="2"/>

(zmiana z 17 na 14)