Simple SVG Matric Calculations
I spent ages trying to figure out how to do matrix calculations in order to finish off this work and eventually hit on this site which helped a lot, I also created a simple image in Inkscape and used the Dialogs -> Item Properties menu to check the transformations after each move of the image in the 4 by 4 grid shown above. All this because Matrix Calculations were starting to do my head in. Anyway, I hope that it helps someone.
| No Flip | Horizontal Flip | Vertical Flip | Horizontal & Vertical Flip | ||
| Rotation: | 0° | (1,0,0,1,X,Y) | (-1,0,0,1,X,Y) | (1,0,0,-1,X,Y) | (-1,0,0,-1,X,Y) |
| 90° | (0,1,-1,0,X,Y) | (0,1,1,0,X,Y) | (0,-1,-1,0,X,Y) | (0,-1,1,0,X,Y) | |
| 180° | (-1,0,0,-1,X,Y) | (1,0,0,-1,X,Y) | (-1,0,0,1,X,Y) | (1,0,0,1,X,Y) | |
| 270° | (0,-1,1,0,X,Y) | (0,-1,-1,0,X,Y) | (0,1,1,0,X,Y) | (0,1,-1,0,X,Y) | |
I decided to shade the cells which had identical content - once I examined the image and the grid I realised that the transformations sometimes resulted in the same image, for instance the top left image is repeated on the end of the third row.
The X and Y correspond to the distance along the X and Y axis where you want to place the image