Sometimes even the best of us end up scratching our heads trying to work out why a complex chain of matrices isn’t being applied as we expected, and for the novice to computer graphics getting an intuitive grasp of how matrix multiplications chain together can be rather difficult. So I built a tool to allow a chain of matrices to be manipulated, which is rather easier to use (I hope!) than cutting and pasting code…
It does bare a little explaining so lets have a look at the main window of the application
The only window in the app is the matrix chain itself, it has a list of 16 matrices that can be reordered (the little up/down icon in the top right of each panel). In the main 3D view there is a large grid showing the XZ plane. Also shown is a 3D axis shape showing the result of multiplying all matrices, as well as a number of small markers indicating the results of each step of the chain.
Each panel allows you to change the type of matrix and a simple formula to effect the XY & Z axes, as well as feedback as to the result of each formula
There just four types of matrix, the Identity matrix does nothing this can be useful to temporarily switch off a matrix. The Translation matrix changes the position along the XY & Z axes, note that if previous matrices have made a rotation this won’t be along the world axes. Next is the Rotation matrix which creates a matrix from Euler angles, the rotation order is ZYX. Finally there is the Scale matrix that applies a scale to the XYZ axes.
Axis formulas can contain a number of standard math functions (see main.c comments) as well as some additions (pun not intended!), the variable time is the number of seconds expressed as a decimal fraction, I also included mousex and mousey so you can effect an axis interactively and I added a round function that takes a value and returns it rounded to the nearest integer (so 1.5 becomes 2.0) although if I’m honest I only implemented that to try out that aspect of the library I’m using.
A few tips, when using translation matrices, at least to begin with, I’d recommend effecting only one axis with a fixed value to avoid confusion, don’t forget you can temporarily toggle any matrix by making it an Identity matrix without loosing the entries for the axes.
When multiplying matrices its important to remember that, A * B does not equal B * A, however don’t forget that a rotation around a single axis, obviously only effects the other two axes. I don’t mind admitting that at one point I had the app injecting test data, and for the life of couldn’t understand why changing the order in the chain didn’t have any effect. There is nothing worse when debugging than looking for a bug that isn’t there, I could have kicked myself!
In making this app I have relied on three great open source libraries, one you’ll probably not be surprised to learn, if you’ve been to this site before, is the rather useful Raylib, making the app cross platform, and of course Nuklear to render the GUI. The other library – that you may not be aware of – is TinyExpr this takes a string and magically transforms it into a value. This is so simple to use it provides just 4 functions, when evaluating libraries to provide this functionality, I was very pleasantly surprised at just how straight forward this library is. It’s no slouch either, I did happen to profile the app out of interest and its a long way down the list, unsurprisingly a heavy weight activity like the GUI is what most of the time is spent doing.
So whether you are trying to get a grasp on matrices or just trying to work out the sequence of matrices you need, I hope you find the application useful.
Grab the source code here