Experiment 6—2D graphics transformation

1. Purpose of the experiment

1. Understand and master 2D graphics transformation: learn to use OpenGL translation, rotation and scaling functions, master the methods of basic graphics transformation and composite graphics transformation.
2. Comprehensively apply 2D graphics transformation functions and human-computer interaction functions to design 2D interactive graphics programs.

2. Experimental content

Requires rewriting the code to use OpenGL geometric transformation functions.
1) Use the glTranslatef() function to realize 2D graphics translation, which can rewrite the rectangular interactive moving program in Experiment 2, as shown in the figure below.
a) before translation
insert image description here


insert image description here
a) Core code after translation :

void Display(void)
{
    
    
    glClear(GL_COLOR_BUFFER_BIT);
	glMatrixMode(GL_MODELVIEW);
	glLoadIdentity();
	glTranslatef(tx,ty,0);
	glColor3f(1.0f, 1.0f, 1.0f);
    glBegin(GL_POLYGON);
	glVertex2f( -0.5, -0.5 );
	glVertex2f( -0.5, 0.5 );
	glVertex2f( 0.5, 0.5 );
	glVertex2f( 0.5, -0.5 );
	glEnd();
	glutSwapBuffers();
}

2) Use the glRotatef() function to realize the rotation of 2D graphics around a fixed point on the plane, which can rewrite the hexagonal rotation program in Experiment 3. As shown below:

insert image description here
insert image description here

3. Reference function

1.gltranslatef (x,y, z) ; //x, y, z represent the translation in the x, y, z direction, for 2D graphics, z=0 2.glrotatef (Q,x,y, z)
; //Q is the angle degree of counterclockwise rotation (0 ~ 360), (x, y, z) is the direction vector of the rotation axis, (x, y, z)=(0, 0, 1) represents along z Axis direction rotation; (x,y,z) = (l, 0, 0 ) represents rotation along the x-axis direction; (x,y,z) = (O, 1, 0) represents rotation along the y-axis direction
3.glscalef (x,y, z) ; //x, y, and z represent the scale factors in the x, y, and z directions, respectively. For 2D graphics, z=0. When the scale factor is -1, a symmetrical transformation is generated

4. Code example

1. A graph is translated by Tx and Ty respectively along the horizontal direction and the vertical direction.

//清屏
glMatrixMode (GL_MODELVIEW);	//设置矩阵模式为模型变换模式,表示在世界坐标系下
glLoadIdentity();					 //将当前矩阵设置为单位矩阵
glTranslatef(Tx,Ty,0);				
DrawSomeShape();
刷新

2. Rotate a figure around an arbitrary point (cx, cy) by an ALPHA angle.

//清屏
glMatrixMode(GL_MODELVIEW); glLoadldentity();	//设置矩阵模式为模型变换模式,表示在世界坐标系下.
glLoadIdentity();					 //将当前矩阵设置为单位矩阵
glTranslatef(cx,cy,0);		//平移回去
glRotatef(ALPHA,0,0,1);     //绕原点旋转ALPHA角度
glTranslatef(-cx,-cy,0);      //平移回原点
 DrawSomeShape ();	
//刷新

3. Scale the Sx and Sy scaling factors of a graph around any point (ex, cy).

//清屏
glMatrixMode(GL_MODELVIEW); //设置矩阵模式为模型变换模式,表示在世界坐标系下
glLoadldentity();	 //将当前矩阵设置为单位矩阵
glTranslatef(cx,cy,0);//平移回去
 glScalef(Sx,Sy,1);	//绕原点水平缩放系数Sx,垂直缩放系数Sy
glTranslatef(-cx,-cy,0);	//平移回原点
DrawSomeShape(); 
//刷新

Core code:

void Display(void)
{
    
    
    glClear(GL_COLOR_BUFFER_BIT);
	glMatrixMode(GL_MODELVIEW);
	glLoadIdentity();
	glTranslatef(tx,ty,0);
	glColor3f(1.0f, 1.0f, 1.0f);
    glBegin(GL_POLYGON);
	glVertex2f( -0.5, -0.5 );
	glVertex2f( -0.5, 0.5 );
	glVertex2f( 0.5, 0.5 );
	glVertex2f( 0.5, -0.5 );
	glEnd();
	glutSwapBuffers();
}

2) Use the glRotatef() function to realize the rotation of 2D graphics around a fixed point on the plane, which can rewrite the hexagonal rotation program in Experiment 3
. As shown in the figure below:
a) Before rotation:
insert image description here
b) After rotation
insert image description here
Core code:

void Display(void)
{
    
    
    glClear(GL_COLOR_BUFFER_BIT);                    //清屏
    glMatrixMode(GL_MODELVIEW);                      //设置矩阵模式为模型变换模式,表示在世界坐标下
    glLoadIdentity();                                //将当前矩阵设置为单位矩阵
    glTranslatef(cx, cy, 0);                         //平移回去
    glRotatef(theta, 0, 0, 1);                       //绕原点旋转theta角度
    glTranslatef(-cx, -cy, 0);                       //平移回原点
    glColor3f(1.0f, 0.0f, 0.0f);                     //设置红色绘图颜色
    glBegin(GL_POLYGON);                             //开始绘制六边形 
    for (int i = 0; i < n; i++)
        glVertex2f(R * cos(theta + i * 2 * PI / n), R * sin(theta + i * 2 * PI / n));  //顶点坐标 
    glEnd();
    glutSwapBuffers();              //双缓存的刷新模式
}
void myidle()
{
    
    
theta += 1.0 ;                     //旋转角增加1° 
    if (theta >= 360) theta -= 360;    //旋转角复位
    glutPostRedisplay();   
}

3) Use the glScalef() function to realize the scaling of 2D graphics around a fixed point, and design and modify on the basis of the previous program. As shown in the figure below:
a) Before scaling
insert image description here

b) After the lock is released,
insert image description here
the core code:

void Display(void)
{
    
    
    glClear(GL_COLOR_BUFFER_BIT);                    //清屏
    glMatrixMode(GL_MODELVIEW);                      //设置矩阵模式为模型变换模式,表示在世界坐标下
    glLoadIdentity();                                //将当前矩阵设置为单位矩阵
    glTranslatef(cx, cy, 0);                         //平移回去
    glRotatef(theta, 0, 0, 1);                       //绕原点旋转theta角度
    glScalef(sx, sy, 1);                             //比例缩放变换
    glTranslatef(-cx, -cy, 0);                       //平移回原点
    glColor3f(1.0f, 0.0f, 0.0f);                     //设置红色绘图颜色
    glBegin(GL_POLYGON);                             //开始绘制六边形 
    for (int i = 0; i < n; i++)
        //glVertex2f(R * cos(theta + i * 2 * PI / n), R * sin(theta + i * 2 * PI / n));  //顶点坐标 
        glVertex2f(R * cos(i * 2 * PI / n), R * sin(i * 2 * PI / n));  //顶点坐标 
    glEnd();
    glutSwapBuffers();              //双缓存的刷新模式
}
void myidle()
{
    
    
theta += 0.2;                     //旋转角度增量 
    if (theta >= 360) theta -= 360;    //旋转角复位(旋转角大于360°时减去360°)
    //比例因子放大一个增量
    sx = sx * 0.999;
    sy = sy * 0.999;
    if (sx > 3)      sx = 1;
    if (sy > 3)      sy = 1;
    glutPostRedisplay(); 
}

4) Modify the code so that a small triangular red flag with a pole rotates continuously along the bottom of the pole. As shown in the figure below:
a) Rotating small red flag
insert image description here
Core code:

void Display(void)
{
    
    
    glClear(GL_COLOR_BUFFER_BIT);                    //清屏
    glMatrixMode(GL_MODELVIEW);                      //设置矩阵模式为模型变换模式,表示在世界坐标下
    glLoadIdentity();                                //将当前矩阵设置为单位矩阵
    glTranslatef(cx, cy, 0);                         //平移回去
    glRotatef(theta, 0, 0, 1);                       //绕原点旋转theta角度
    glTranslatef(-cx, -cy, 0);                       //平移回原点
    
    //旗杆
    glColor3f(1.0f, 1.0f, 1.0f);                     //设置白色色绘图颜色
    glBegin(GL_LINES);                             
    glVertex2f(0.0f,0.0f);                          
    glVertex2f(0.0f, R);
    glEnd();

    //旗帜
    glColor3f(1.0f, 0.0f, 0.0f);                     //设置红色绘图颜色
    glBegin(GL_POLYGON);  
    glVertex2f(0.0f, R);
    glVertex2f(0.0f, R-n);
    glVertex2f(n , R);
    glEnd();
    glutSwapBuffers();              //双缓存的刷新模式
}
void myidle()
{
    
    
theta += 0.2;                     //旋转角度增量 
    if (theta >= 360) theta -= 360;    //旋转角复位(旋转角大于360°时减去360°)
    glutPostRedisplay();
}

5) The regular hexagon zooms in while rotating, zooms in until it is close to the entire display screen, and then zooms out continuously, and so on. As shown in the figure below:
a) Initial state
insert image description here

b) zoom in to
insert image description here

c) Minified to
insert image description here
the core code:

void Display(void)
{
    
    
    glClear(GL_COLOR_BUFFER_BIT);                    //清屏
    glMatrixMode(GL_MODELVIEW);                      //设置矩阵模式为模型变换模式,表示在世界坐标下
    glLoadIdentity();                                //将当前矩阵设置为单位矩阵
    glTranslatef(cx, cy, 0);                         //平移回去
    glRotatef(theta, 0, 0, 1);                       //绕原点旋转theta角度
    glScalef(sx, sy, 1);                             
    glTranslatef(-cx, -cy, 0);                       //平移回原点
    glColor3f(1.0f, 0.0f, 0.0f);                     //设置红色绘图颜色
    glBegin(GL_POLYGON);                             //开始绘制六边形 
    for (int i = 0; i < n; i++)
        //glVertex2f(R * cos(theta + i * 2 * PI / n), R * sin(theta + i * 2 * PI / n));  //顶点坐标 
        glVertex2f(R * cos(i * 2 * PI / n), R * sin(i * 2 * PI / n));  //顶点坐标 
    glEnd();
    glutSwapBuffers();              

}
bool k=true;
void myidle()
{
    
    
theta += 0.2;                     //旋转角度增量 
    if (theta >= 360) theta -= 360;    //旋转角复位(旋转角大于360°时减去360°)
    //比例因子放大一个增量
    if (!k) {
    
    
        sx = sx * 0.99;
        sy = sy * 0.99;
    }
    else {
    
    
        sx = sx * 1.01;
        sy = sy * 1.01;
    }
    if (sx > 1.5 & sy > 1.5)    k = false;
    if(sx < 0.3 & sy < 0.3)     k = true;
    glutPostRedisplay(); 
}

5. Thinking questions

1. When rotating around a fixed point, the code sequence is rewritten as:

glTranslatef(-cx,-cy,0); //平移回原点
glRotatef(ALPHA,0,0,1); //绕原点旋转ALPHA角度
glTranslatef(cx,cy,0); //平移回去

What will the graphics look like?
Answer: The graphics will be rotated around (-cx,-cy).
2. When scaling around a fixed point, the code sequence is rewritten as:

glTranslatef(-cx,-cy,0); //平移回原点
glScalef(Sx,Sy,0); //绕原点水平缩放系数Sx,垂直缩放系数Sy
glTranslatef(cx,cy,0); //平移回去

What will the graphics look like?
Answer: The graphics will be scaled around (-cx,-cy) as the center.
insert image description here

Guess you like

Origin blog.csdn.net/weixin_52030647/article/details/130728432