v804-第四章opengl的2d图形渲染课程4二维变换

1、二维变换学习如何使图形运动平移变换、旋转变换和放缩学会复杂变换的分解与合成学会使用OpenGL的几何变换函数本章目标数学基础二维几何变换齐次坐标复合变换其它变换三维几何变换图形对象的几何变换OpenGL的几何变换函数主要内容矢量（vector）连接两个点的有向线段。又称向量行向量和列向量两种表示矢量和数学基础矢量的数乘矢量的点积运算性质数学基础矢量的长度单位矢量 矢量间的夹角矢量的叉积右手法则数学基础矩阵（Matrix)mn 阶矩阵n阶方阵（mn）单位矩阵 n阶方阵，对角线元素为1， 其它元素为0数学基础矩阵（续）行向量与列向量当m1时，A退化为行向量a11, a12, , a1n当n1时，

2、A退化为列向量a11, a21, , am1T矩阵的加法 A=(aij)mn，B(bij) mnA与B的和记为AB性质：结合律和交换律数学基础矩阵（续）矩阵的数乘 矩阵的乘法 性质：结合律和分配律（不满足交换律）数学基础矩阵（续）矩阵的转置 矩阵的逆n阶方阵A是可逆的，若存在另一个n阶方阵B，使得 ABBAIn，称B是A的逆阵，记为BA1数学基础平移变换 (translation transformation)将点P(x, y)在x轴方向、y轴方向分别平移距离tx，ty，得到点P(x, y)，则记为：T(tx , ty)矩阵表示：二维几何变换旋转变换(rotation transformati

3、on)如点P(x, y)的极坐标表示（r为P 到原点的距离）绕坐标原点（称为参照点，基准点）旋转角度 （逆时针为正，顺时针为负）二维几何变换旋转变换(续）记为：R()矩阵表示为：二维几何变换放缩变换(scaling transformation)将点P(x, y)在x方向, y方向分别放缩 sx 和 sy 倍，得到点P(x, y)以坐标原点为放缩参照（基准）点不仅改变了物体的大小和形状，也改变了它离原点的距离记为：S(sx, sy)二维几何变换利用矩阵计算变换后的坐标时，平移、旋转和放缩变换分别为：运算不统一，如何统一运算？二维几何变换为什么需要齐次坐标?齐次坐标就是将一个原本是n维的向量用一

4、个n+1维向量来表示。例如，二维点(x,y)的齐次坐标表示为(hx,hy,h)。由此可以看出，一个向量的齐次表示是不唯一的，齐次坐标的h取不同的值都表示的是同一个点，比如齐次坐标(8,4,2)、(4,2,1)表示的都是二维点(4,2)齐次坐标为什么需要齐次坐标?对多个点计算多次不同的变换时，分别利用矩阵计算各变换导致计算量大运算表示形式不统一平移为“”旋转和放缩为“”统一运算形式后，可以先合成变换运算的矩阵，再作用于图形对象齐次坐标定义 Homogeneous Coordinate（x，y）点对应的齐次坐标定义为（x，y）点对应的齐次坐标为三维空间的一条直线 标准齐次坐标（x，y，1）h0表示

5、无穷远点齐次坐标二维变换的矩阵表示平移变换旋转变换齐次坐标放缩变换变换具有统一表示形式的优点便于变换合成连续变换时，可以先得到变换的矩阵便于硬件实现齐次坐标变换的性质平移和旋转变换具有可加性放缩变换具有可乘性齐次坐标逆变换逆平移变换：正平移距离tx，ty逆旋转变换：旋转角度为齐次坐标逆放缩变换：放缩系数为sx和sy齐次坐标变换合成方法：连续变换时，先计算变换矩阵，再计算坐标优点：（1）提高了对图形依次做多次变换的运算效率如：图形上有n个顶点Pi，如果依次施加的变换为T，R，那么顶点Pi 变换后的坐标为每个顶点需要2次矩阵相乘只需要1次矩阵相乘复合变换变换合成（续）（2）提供构造复杂变换的方法

6、对图形作较复杂的变换时，不直接去计算这个变换，而是将其先分解成多个基本变换，再合成总的变换复合变换Composite transformation多个变换的组合可通过单个变换矩阵来计算矩阵乘积复合变换连续平移变换平移向量为(t1x，t1y)和(t2x，t2y)点P 经变换为P，则有复合矩阵复合平移变换连续旋转P 经连续旋转角度分别为 1 和 2 后连续旋转具有相加性复合旋转变换连续放缩连续放缩因子分别为：(s1x, s1y) 和 (s2x, s2y)复合放缩变换关于任意参照点 的旋转变换步骤：（1）平移对象使参照（基准）点移到原点（2）绕坐标原点旋转（3）平移对象使基准点回到原始位置二维基准点

7、旋转关于任意参照点 的放缩变换 步骤：（1）平移对象使基准点与坐标原点重合（2）放缩变换（3）反向平移使得基准点回到初始位置二维基准点放缩变换合成时，矩阵相乘的顺序单次变换：列向量表示点复合变换：先作用的放在连乘的右端，后作用的放在连乘的左端点表示成行向量呢？小结对称变换（反射变换、镜像变换：reflection）(1)关于 x 轴的对称变换(2)关于 y 轴的对称变换 其它变换(3)关于任意轴的对称变换平移（tx, ty)使l 过坐标原点，记为T1旋转，记R1对称, 记SYx旋转-,记 R2平移(-tx, -ty)， 记T2总变换：T2R2 SYxR1 T1其它变换错切变换（shear）依赖

8、轴：坐标保持不变的坐标轴，又称参考轴方向轴：余下的坐标轴1、以y 轴为依赖轴的错切变换 （1）以 y = 0为参考轴（坐标保持不变）Shx是对y=1上的点沿x轴移动的距离其它变换（2）以 y = yref 为参考轴x = x + shx ( y yref)y = y其它变换2、以x轴为依赖轴的错切变换其它变换仿射变换affine transformation二维线性变换的一般形式平移，旋转，放缩，对称和错切是特例特点：保持平行线间的平行关系其它变换例：证明二维复合变换的矩阵总能表示为： 证明：其它变换图形对象点，线段，多边形，圆，字符方法先生成点集，再对其中的点进行变换运算量大对参数变换线段：

9、两个端点多边形：各顶点圆：圆心和半径前提图形对象的几何表示不发生变化图形对象的几何变换说明在核心库中，每种几何变换是一个独立的函数所有变换都是在三维坐标系中定义基本几何变换函数平移函数：glTranslatefd(tx, ty, tz)对二维变换而言，取tz0旋转函数：glRotatefd(theta, vx, vy, vz)向量(vx, vy, vz)为通过坐标原点旋转轴theta为旋转角的度数放缩函数：glScalefd(sx, sy, sz)相对坐标原点的缩放当参数为负时，相对于平面进行对称变换OpenGL 几何变换函数例程序 6-1void display (void) glColor

10、3f (0.0, 0.0, 1.0); glRecti (20, 50, 100, 80); glColor3f (1.0, 0.0, 0.0); glTranslatef (-120.0, -40.0, 0.0); glRecti (20, 50, 100, 80); glLoadIdentity ( ); glColor3f (1.0, 0.0, 1.0); glRotatef (135.0, 0.0, 0.0, 1.0);glRecti (20, 50, 100, 80); glLoadIdentity ( ); glColor3f ( 0.0, 1.0,0.0); glScalef (

11、0.5, -1.0, 1.0); glRecti (20, 50, 100, 80); glColor3f(0,0,0); glLoadIdentity ( ); glBegin(GL_LINES); glVertex2i(0,-Y/2+5); glVertex2i(0,Y/2-5); glVertex2i(X/2-5,0); glVertex2i(-X/2+5,0); glEnd(); glutSwapBuffers();注意：几何变换矩阵只有1个OpenGL几何变换函数例6-1（续）#include #include #include int X=0,Y=0;void Reshape(in

12、t width, int height) glViewport(0, 0, width, height); glMatrixMode(GL_PROJECTION); glLoadIdentity(); gluOrtho2D(-width/2, width/2, -height/2, height/2); glMatrixMode(GL_MODELVIEW);/定义模型观察变换矩阵 glLoadIdentity(); glClear (GL_COLOR_BUFFER_BIT); X=width, Y=height;void init (void) glClearColor (1.0, 1.0,

13、1.0, 0.0); glMatrixMode(GL_PROJECTION); gluOrtho2D(0.0, 250.0, 0.0, 250.0);OpenGL几何变换函数（续）int main(int argc, char* argv) glutInit(&argc, argv); glutInitDisplayMode (GLUT_DOUBLE | GLUT_RGB); glutInitWindowSize (250, 250); glutInitWindowPosition (300, 300); glutCreateWindow (Transformation); init ();

14、glutDisplayFunc(display); glutReshapeFunc(Reshape); glutMainLoop(); return 0;OpenGL几何变换函数矩阵操作模型观察矩阵：glMatrixMode(GL_MODELVIEW)建立当前观察矩阵还有两种方式：纹理和颜色模式，默认为观察模式设置当前矩阵为单位矩阵：glLoadIdentity()矩阵栈4种：观察、投影、纹理初始状态下，每栈仅包含一单位栈压栈：glPushMatrix()出栈：glPopMatrix()OpenGL几何变换函数机器人手臂#include #define BASE_HEIGHT 2.0#defi

15、ne BASE_RADIUS 1.0#define LOWER_ARM_HEIGHT 5.0#define LOWER_ARM_WIDTH 0.5#define UPPER_ARM_HEIGHT 5.0#define UPPER_ARM_WIDTH 0.5typedef float point3;GLfloat theta = 0.0,0.0,0.0;GLint axis = 0;GLUquadricObj *p; /* pointer to quadric（二次曲面） object */void myinit() glClearColor(1.0, 1.0, 1.0, 1.0); glCol

16、or3f(1.0, 0.0, 0.0); p=gluNewQuadric(); /* allocate quadric object */ gluQuadricDrawStyle(p, GLU_LINE); /* render it as wireframe */OpenGL几何变换函数例62（续）void base() glPushMatrix();/* rotate cylinder to align with y axis */ glRotatef(-90.0, 1.0, 0.0, 0.0);/* cyliner aligned with z axis*/ gluCylinder(p,

17、BASE_RADIUS, BASE_RADIUS, BASE_HEIGHT, 5, 5); glPopMatrix();void upper_arm() glPushMatrix(); glTranslatef(0.0, 0.5*UPPER_ARM_HEIGHT, 0.0); glScalef(UPPER_ARM_WIDTH, UPPER_ARM_HEIGHT, UPPER_ARM_WIDTH); glutWireCube(1.0); glPopMatrix();void lower_arm() glPushMatrix(); glTranslatef(0.0, 0.5*LOWER_ARM_H

18、EIGHT, 0.0); glScalef( LOWER_ARM_WIDTH, LOWER_ARM_HEIGHT, LOWER_ARM_WIDTH); glutWireCube(1.0); glPopMatrix();OpenGL几何变换函数void display(void)/* Accumulate ModelView Matrix as we traverse tree */ glClear(GL_COLOR_BUFFER_BIT); glLoadIdentity(); glColor3f(1.0, 0.0, 0.0); glRotatef(theta0, 0.0, 1.0, 0.0);

19、 base(); glTranslatef(0.0, BASE_HEIGHT, 0.0); glRotatef(theta1, 0.0, 0.0, 1.0); lower_arm(); glTranslatef(0.0, LOWER_ARM_HEIGHT, 0.0); glRotatef(theta2, 0.0, 0.0, 1.0); upper_arm(); glutSwapBuffers();void mouse(int btn, int state, int x, int y)/* left button increase joint angle, right button decrea

20、ses it */if(btn=GLUT_LEFT_BUTTON & state = GLUT_DOWN)thetaaxis += 5.0; if( thetaaxis 360.0 ) thetaaxis -= 360.0;if(btn=GLUT_RIGHT_BUTTON & state = GLUT_DOWN) thetaaxis -= 5.0; if( thetaaxis 360.0 ) thetaaxis += 360.0; display();OpenGL几何变换函数void menu(int id)/* menu selects which angle to change or wh

21、ether to quit */ if(id = 1 ) axis=0; if(id = 2) axis=1; if(id = 3 ) axis=2; if(id =4 ) exit(0);void myReshape(int w, int h) glViewport(0, 0, w, h); glMatrixMode(GL_PROJECTION); glLoadIdentity(); if (w = h) glOrtho(-10.0, 10.0, -5.0 * (GLfloat) h / (GLfloat) w, 15.0 * (GLfloat) h / (GLfloat) w, -10.0

22、, 10.0); else glOrtho(-10.0 * (GLfloat) w / (GLfloat) h, 10.0 * (GLfloat) w / (GLfloat) h, -5.0, 15.0, -10.0, 10.0); glMatrixMode(GL_MODELVIEW); glLoadIdentity();OpenGL几何变换函数void main(int argc, char *argv) glutInit(&argc, argv); glutInitDisplayMode(GLUT_DOUBLE | GLUT_RGB | GLUT_DEPTH); glutInitWindo

23、wSize(500, 500); glutCreateWindow(robot); myinit(); glutReshapeFunc(myReshape); glutDisplayFunc(display); glutMouseFunc(mouse); glutCreateMenu(menu); glutAddMenuEntry(base, 1); glutAddMenuEntry(lower arm, 2); glutAddMenuEntry(upper arm, 3); glutAddMenuEntry(quit, 4); glutAttachMenu(GLUT_MIDDLE_BUTTO

24、N); glutMainLoop();OpenGL几何变换函数使用双缓冲以GLUT_DOUBLE为参数调用glutInitDisplayMode，设置双缓存的窗口模式在显示回调函数的最后调用glutSwapBuffers()函数空闲函数（回调函数）定义：如 void spinCube()功能：程序不受用户干预时执行spinCube()函数注册：glutIdleFunc(spinCube) （在main函数中调用）重绘制函数glutPostRedisplay()OpenGL几何变换函数旋转的立方体8个顶点的颜色不同不停地旋转鼠标控制改变方向#include #include /定义顶点坐标和颜色

25、GLfloat vertices3 = -1.0,-1.0,-1.0,1.0,-1.0,-1.0, 1.0,1.0,-1.0, -1.0,1.0,-1.0, -1.0,-1.0,1.0, 1.0,-1.0,1.0, 1.0,1.0,1.0, -1.0,1.0,1.0;GLfloat colors3 = 0.0,0.0,0.0,1.0,0.0,0.0, 1.0,1.0,0.0, 0.0,1.0,0.0, 0.0,0.0,1.0, 1.0,0.0,1.0, 1.0,1.0,1.0, 0.0,1.0,1.0; OpenGL几何变换函数void polygon(int a, int b, int c

26、, int d)/* draw a polygon via list of vertices */ glBegin(GL_POLYGON); glColor3fv(colorsa); glVertex3fv(verticesa); glColor3fv(colorsb); glVertex3fv(verticesb); glColor3fv(colorsc); glVertex3fv(verticesc); glColor3fv(colorsd); glVertex3fv(verticesd); glEnd();void colorcube(void)/* map vertices to fa

27、ces */polygon(0,3,2,1);polygon(2,3,7,6);polygon(0,4,7,3);polygon(1,2,6,5);polygon(4,5,6,7);polygon(0,1,5,4);OpenGL几何变换函数static GLfloat theta = 0.0,0.0,0.0;static GLint axis = 2;void display(void) /* display callback, clear frame buffer and z buffer, rotate cube and draw, swap buffers */ glClear(GL_C

28、OLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT); glLoadIdentity(); glRotatef(theta0, 1.0, 0.0, 0.0); glRotatef(theta1, 0.0, 1.0, 0.0); glRotatef(theta2, 0.0, 0.0, 1.0); colorcube(); glutSwapBuffers();void spinCube()/* Idle callback, spin cube 2 degrees about selected axis */ thetaaxis += 2.0; if( thetaaxis 3

29、60.0 ) thetaaxis -= 360.0;/* display(); */ glutPostRedisplay();OpenGL几何变换函数void mouse(int btn, int state, int x, int y)/* mouse callback, selects an axis about which to rotate */ if(btn=GLUT_LEFT_BUTTON & state = GLUT_DOWN) axis = 0; if(btn=GLUT_MIDDLE_BUTTON & state = GLUT_DOWN) axis = 1; if(btn=GL

30、UT_RIGHT_BUTTON & state = GLUT_DOWN) axis = 2;void myReshape(int w, int h) glViewport(0, 0, w, h); glMatrixMode(GL_PROJECTION); glLoadIdentity(); if (w = h) glOrtho(-2.0, 2.0, -2.0 * (GLfloat) h / (GLfloat) w, 2.0 * (GLfloat) h / (GLfloat) w, -10.0, 10.0); else glOrtho(-2.0 * (GLfloat) w / (GLfloat) h, 2.0 * (GLfloat) w / (GLfl