Matrices, graphics, and all that jazz

As most of you probably know, matrices are a critical part of the representation of sprites and other images on computer screens. This is because most of the interesting things that we want to do with images are simple linear transformations, such as reflections, rotations, projections, and dilations. In essence, the transformation is applied to each pixel on the image, represented by some n dimensional vector, which are then appropriately mapped via the specifications of the transform. In this blog post, I figured I’d talk about some of the more advanced techniques and applications when dealing with computer graphics, to show why one may consider working with matrices to be important.

Often times it’s simply not enough to simply reflect, or rotate an image in space. Often times, you want to move it around on the screen as well. Affine transforms solve this problem by allowing a simple linear transformation like the above noted one to be combined with a translation. In particular, Affine transforms have the very important property that they preserve certain properties of the object that is being transformed. In particular, parallel lines of an object will remain parallel after an affine transformation. Some affine transformations can also preserve the relative distances on an object, which is known as rigid motion.

affine1.PNG

The above transformation represents the translation x‘ = x + tx; y‘ = y + ty. It becomes obvious why we need the third vector - it is how we add and subtract from our standard x, y coordinates. One of the caveats of affine transformations is that it requires 3×3 matrices as opposed to 2×2 matrices. An extra dimension is required because the transformations are not linear in 2D space. This is why certain APIs in game design IDEs such as XNA require a 3-dimensional matrix, even though you’ll only be extracting 2 dimensions of information from that result. The nice thing though is that affine transformations can also handle general linear transformations without the translation. For example:

affine2.PNG

Represents the standard unit rotation transformation. By setting the bottom-right corner to 1 and all other values in the nth row and column to 0, you can perform a standard n-1 dimensional linear transformation without the translation, while conforming to the n dimensional scheme. This makes it easy to perform affine and non-affine transformations without having to switch between different dimensional spaces. For any affine transformation, the nth column, 1 through n-1 row represents the translation, while the topleft n-1 by n-1 minor represents the linear transformation. For more examples of affine transformations, see page 73 here:

http://books.google.com/books?id=_IJjKSRS558C&pg=PA70&lpg=PA70&dq=affine+transform+computer+graphics&source=web&ots=BQSPHWnQY7&sig=AsG2-bypmQ5jxfyz0yDaFLIbVXc&hl=en#PPA72,M1

Something else that I would like to talk about in this blog post though is how linear transformations are used in color. There’s a lot of information out there on color theory, but I won’t mention all the details because a) I’m a lowly undergraduate and don’t know all that much myself, and b) there’s a LOT out there on it and I wouldn’t have enough space here in my blog post.

Basically though, color is represented in a three dimensional space (sometimes a fourth dimension for a certain attribute, the alpha, is used as well). There are many different standards out there; most of you have probably heard of RGB, in which red, green, and blue colored light can be added from 0 to 255 each. When all lights are on 255, the output is white; when all are on 0, the output is black. However, different standards exist each with unique advantages and disadvantages. Hue, saturation, luminance is used by Microsoft. CIE coordinates use the following grid, where Z = 1 - x - y.

cie_color_diagram.gif

And others exist. The conversion from one color system to another is all based on linear transformations. For example, the CIE to RGB conversion:

color.PNG

Much of color coordinate theory is based in vectors in three dimensional color space, so matrices and linear algebra concepts are very important in their computation.

Sources:

http://en.wikipedia.org/wiki/CIE_1931_color_space#Experimental_results.E2.80.94the_CIE_RGB_color_space

http://books.google.com/books?id=_IJjKSRS558C&pg=PA70&lpg=PA70&dq=affine+transform+computer+graphics&source=web&ots=BQSPHWnQY7&sig=AsG2-bypmQ5jxfyz0yDaFLIbVXc&hl=en#PPA73,M1

http://en.wikipedia.org/wiki/Transformation_matrix#Affine_transformations

http://en.wikipedia.org/wiki/Wikipedia:WikiProject_Color/Normalized_Color_Coordinates

http://en.wikipedia.org/wiki/Affine_transformation

http://msdn2.microsoft.com/en-us/library/aa187935.aspx

Posted in Topics: Uncategorized

Jump down to leave a comment.

Leave a Comment

You must be logged in to post a comment.



* You can follow any responses to this entry through the RSS 2.0 feed.