A Personal Understanding to Matrix Transformation in Graphics
-------------------------------------------------------------

Matrix Transformation is a vital important concept for people who are at their beginning of learning Graphics. And this concept usually get hard to learn, especially from a mathematical perspective. This article, however, is not going to elaborate such a theory by an arithmetic way. Instead I'll just focus on a single topic and talk about what I got from that.

What I'm going to talk is "how to understand that more than one matrix integrate into one result matrix which will then be applied to a vertex to make it transformed."

=================

Let's start from the simplest case, there's only one matrix applied to a vertex, which is written like this:

Va = [M1] * Vb

It's obvious that "Vb" is transformed to "Va" through the matrix "[M1]". But on the other side, we can think this formula from another meaning, which is in fact the essential idea in this article. Before explaining the idea, let's give a little background knowledge first : the default coordinate in which we're drawing objects is actually a kind of matrix and let's call it "[M0]" for example. With this hidden matrix exposed out, we can replace the formula as this :

Va = [M0] * [M1] * Vb

Now the idea comes. We can see the representation as that the default coordinate(matrix) "[M0]" is transformed by the other matrix "[M1]" and turned into a new coordinate, and then, "Vb" is just drawn at the location as it is, but in this new coordinate. the value of "Va" represents the location of "Vb" where we look it from the default coordinate("[M0]").

So briefly speaking, There are two understandings to the same formula, just from two directions opposed to each other.

         ---------------> (a)
Va = [M0] * [M1] * Vb
         <--------------- (b)

(a) stands at the "coordinate"'s view to see the transformation. A coordinate turns into others one by one from left to right side, and in the final result coordinate, the vertex is drawn to the location where it's value reflects.

And (b) see the transformation standing from the "vertex"'s view. A vertex is applied by a matrix and turns into another vertex with the different location. And the new vertex continues the transformation until the last matrix is applied to it. And eventually we draw this result vertex under the default coordinate ("[M0]").

Both thoughts get the same result. "Va", the left side of the equation, represents the original "Vb" is transformed to a new location where now "Va" lies in the default coordinate "[M0]". This is a good example showing "consider the same one thing from more than one aspects".

=================

It's time I give a practical case using this philosophy now, still a simple case, though. Suppose there is an arbitrary object composed of vertices(ex. a triangle with 3 vertices) in the default coordinate "[M0]". What if we want to firstly move it to somewhere, and secondly make it self-rotated, which means rotate around its own axes?

Let's break this question down. Actually our question include two transformations, MOVE and ROTATE, each can be represented by a matrix. we'll give them a name respectively, "[T]" for MOVE("Translation") and "[R]" for ROTATE("Rotation"). We know that these two matrices will be integrate to one final matrix and be applied to the object vertices, but what's the sequence of mixing? The different order, results in the different effect. So now we touched the core the question.

The answer is simple. If we adopt the idea (a), The order is alike with the way we describes the requirement. First we move the coordinate to somewhere and then rotate the coordinate to some angles. And at last we draw the object on that transformed coordinate. While if we adopt the idea (b), what we should do is to rotate the object first and move this rotated object to somewhere we're aiming on the unchanged and default matrix. Both formulas are same:

           ---------------> (a)
OBJa = [T] * [R] * OBJb
           <--------------- (b)

=================

A little advanced example enhancing the above case is to take the "Camera View Transformation" into the consideration. We know "Camera View Transformation" is also a kind of matrix and so it can be thought as such. I don't want to go to the details too much here except only a note that the movement relationship between a camera and objects is relative. If the camera moves forward 10 steps, this also means the whole objects in the scene move backward 10 steps with the camera keeps unmoved.

Since what we're transforming is objects rather than the camera, we should take the inversed matrix of cameras' as the transforming matrix, we call it "Inv([C])", for example. The formula finally looks like this :

------------------------> (a)
OBJa = Inv([C]) * [T] * [R] * OBJb
           <------------------------ (b)

A Personal Understanding to Matrix Transformation in Graphics的更多相关文章

  1. The history of programming languages.(transshipment) + Personal understanding and prediction

    To finish this week's homework that introduce the history of programming languages , I surf the inte ...

  2. Matrix Transformation codechef 数学题

    https://www.codechef.com/problems/MTRNSFRM 我只能说codechef的题好劲爆,这题居然是easy的题,太可怕了.而且还有一点就是codechef的题解很难看 ...

  3. android.graphics.Matrix

    Matrix类包含了一个3x3的矩阵用来改变坐标,它没有一个构造器来初始化它里边的内容,所以创建实例后需要调用reset()方法生成一个标准matrix,或者调用set..一类的函数,比如setTra ...

  4. [Android]android.graphics.Camera实现图像的旋转、缩放,配合Matrix实现图像的倾斜

    android.graphics.Camera可以对图像执行一些比较复杂的操作,诸如旋转与绽放,与Matrix可实现图像的倾斜. 个人总结Camera与Matrix的一些区别如下: Camera的ro ...

  5. Matrix: android 中的Matrix (android.graphics.Matrix) (转)

    本篇博客主要讲解一下如何处理对一个Bitmap对象进行处理,包括:缩放.旋转.位移.倾斜等.在最后将以一个简单的Demo来演示图片特效的变换. 1. Matrix概述 对于一个图片变换的处理,需要Ma ...

  6. UNITY_MATRIX_IT_MV[Matrix] (转载)

    转载 http://blog.csdn.net/cubesky/article/details/38682975 前面发了一篇关于unity Matrix的文章. http://blog.csdn.n ...

  7. 【转】2D动画:view的Matrix

    Matrix,中文里叫矩阵,高等数学里有介绍,在图像处理方面,主要是用于平面的缩放.平移.旋转等操作. 首先介绍一下矩阵运算.加法和减法就不用说了,太简单了,对应位相加就好.图像处理,主要用到的是乘法 ...

  8. UNITY_MATRIX_IT_MV[Matrix]

    http://blog.csdn.net/cubesky/article/details/38682975 前面发了一篇关于unity Matrix的文章. http://blog.csdn.NET/ ...

  9. Matrix(单点移动,多点缩放)

    package cn.iris.matrixapi; import android.app.Activity; import android.graphics.Matrix; import andro ...

随机推荐

  1. noip第1课资料

  2. PAT甲级 1122. Hamiltonian Cycle (25)

    1122. Hamiltonian Cycle (25) 时间限制 300 ms 内存限制 65536 kB 代码长度限制 16000 B 判题程序 Standard 作者 CHEN, Yue The ...

  3. Python3 安装 PyQt5 -pycharm 环境搭建

    执行命令: pip3 install PyQt5 PyQt5+python3+pycharm开发环境配置   1.下载PyQt 官方网站:http://www.riverbankcomputing.c ...

  4. php excel

    项目中需要把excel转为索引数组,不输出key 只说下普世技巧 找了php excel插件 发现需要createReader方法,在sublime中search,可以搜索文件内容,找到使用creat ...

  5. Dnsmasq安装与配置-搭建本地DNS服务器

    默认的情况下,我们平时上网用的本地DNS服务器都是使用电信或者联通的,但是这样也导致了不少的问题,首当其冲的就是上网时经常莫名地弹出广告,或者莫名的流量被消耗掉导致网速变慢.其次是部分网站域名不能正常 ...

  6. redhat安装docker

    一.禁用selinux 由于Selinux和LXC有冲突,所以需要禁用selinux.编辑/etc/selinux/config,设置两个关键变量.     SELINUX=disabled  SEL ...

  7. Asp.Net Core探索 之 appsettings.json

    appsettings.json是什么? 相信大家在.Net Framework的项目都会用的web.config,app.config这些文件,appsettings.json文件就是Asp.Net ...

  8. CefSharp 支持mp4

    效果图: 下载链接:创建wpf项目引用 如下:链接:链接: https://pan.baidu.com/s/1UCJmslLPSDph7VrYhXM9gw 密码: j3n4 链接: https://p ...

  9. 迁移桌面程序到MS Store(7)——APPX + Service

    本篇我们以一个Sample工程,来说明如何把一个常见结构的desktop application,转制成APPX并在MS Store提供下载. 之前的篇章中,我们已经介绍了一些内容,包括如何通过Vis ...

  10. 一步一步学习Swift之(三):巧用AutoLayout布局

    一些初学者经常在使用autoLayout时,做得效果不太理想,经常会出现界面错乱的情况. 本文章用一个小实例说明autoLayout的使用 非常的简单,只要记住 规则就可以使界面适屏布局,适配各种ip ...