计算机图形学课程设计-图形绘制变换.doc

计算机图形学 实验报告课程名称 : 计算机图形学 实验名称 : 图形绘制与变换 学 院 : 电子信息工程学院 专 业 : 计算机科学与技术 班 级 : 11计科本 01班 学 号 : 111102020103 姓 名 : 张慧 指导教师 : 王征风 二零一四年目录一、引言3二、设计需求42.1 设计目标42.2 设计环境42.2.1 VC+6.042.2.2 MFC42.3 设计题目及要求52.4 总体流程图5三、课程设计原理53.1 实现的算法53.1.2 Bresenham算法画直线63.1.3 中心点算法画圆和椭圆63.2 图形变换的基本原理83.2.1 平移变换83.2.2 旋转变换83.2.3 比例变换9四、总体设计与功能实现94.1 主要界面设计94.2 设置颜色界面94.2.1 界面设置代码94.2.2 运行结果104.3 二维线画图元实现104.4 画多边形功能的实现144.5 画Bezier曲线功能的实现154.6 二维图形变换的实现164.7 三维图形的变换18五、实验心得体会一、引言 计算机图形学(Computer Graphics，简称CG)是一种使用数学算法将二维或三维图形转化为计算机显示器的栅格形式的科学。简单地说，计算机图形学的主要研究内容就是研究如何在计算机中表示图形、以及利用计算机进行图形的计算、处理和显示的相关原理与算法。是计算机科学的一个分支领域，主要关注数字合成与操作视觉的图形内容。计算机图形学研究的是应用计算机产生图像的所有工作，不管图像是静态的还是动态的，可交互的还是固定的，等等。图形API是允许程序员开发包含交互式计算机图形操作的应用而不需要关注图形操作细节或任务系统细节的工具集。计算机图形学有着广泛的应用领域，包括物理、航天、电影、电视、游戏、艺术、广告、通信、天气预报等几乎所有领域都用到了计算机图形学的知识，这些领域通过计算机图形学将几何模型生成图像，将问题可视化从而为各领域更好的服务。 计算机图形学利用计算机产生让人赏心悦目的视觉效果，必须建立描述图形的几何模型还有光照模型，再加上视角、颜色、纹理等属性，再经过模型变换、视图变换、投影操作等，这些步骤从而实现一个完整的OpenGL程序效果。OpenGL是一个开放的三维图形软件包，它独立于窗口系统和操作系统，以它为基础开发的应用程序可以十分方便地在各种平台间移植。计算机图形学通过应用OpenGL的功能，使得生成的图形效果具有高度真实感。学习计算机图形学的重点是掌握OpenGL在图形学程序中的使用方法。事实上，图形学也把可以表示几何场景的曲线曲面造型技术和实体造型技术作为其主要的研究内容。同时，真实感图形计算的结果是以数字图像的方式提供的，计算机图形学也就和图像处理有着密切的关系。通过21世纪是信息的时代，在日新月异的科技更新中相信计算机会发挥越来越重要的作用，计算机图形学也会在更多的领域所应用，虽然我国在这方面还比较薄弱，但相信会有越来越好的时候的。二、设计需求2.1 设计目标 以图形学算法为目标，深入研究。继而策划、设计并实现一个能够表现计算机图形学算法原理的或完整过程的演示系统，并能从某些方面作出评价和改进意见。通过完成一个完整程序，经历策划、设计、开发、测试、总结和验收各阶段，达到：巩固和实践计算机图形学课程中的理论和算法；学习表现计算机图形学算法的技巧；培养认真学习、积极探索的精神。2.2 设计环境 2.2.1 VC+6.0 VC+6.0是 Microsoft 公司推出的一个基于 Windows 系统平台、可视化的 集成开发环境，它的源程序按 C+语言的要求编写，并加入了微软提供的功能 强大的 MFC(Microsoft Foundation Class)类库。MFC 中封装了大部分 Windows API 函数和 Windows 控件，它包含的功能涉及到整个 Windows 操作系统。MFC 不仅给用户提供了 Windows 图形环境下应用程序的框架， 而且还提供了创建应 用程序的组件，这样，开发人员不必从头设计创建和管理一个标准 Windows 应 用程序所需的程序，而是从一个比较高的起点编程，故节省了大量的时间。另 外，它提供了大量的代码，指导用户编程时实现某些技术和功能。因此，使用VC+提供的高度可视化的应用程序开发工具和 MFC 类库，可使应用程序开发变 得简单。 2.2.2 MFC MFC(Microsoft Foundation Classes) ，是 一 个 微 软 公 司 提 供 的 类 库 （ class libraries）以 C+类的形式封装了 Windows 的 API， ， 它包含了窗口等许多类的定义。各种类的集合构成了一个应运程序的框架结构，以减少应用程序开发人员的工作 量。其中包含的类包含大量 Windows 句柄封装类和很多 Windows 的内建控件和组 件的封装类。MFC 6.0 版本封装了大约 200 个类，其中的一些可以被用户直接使用。例如CWnd 类封装了窗口的功能，包括打印文本、绘制图形及跟踪鼠标指针的移动等；CsplitterWnd 类是从 CWnd 类派生出来的，继承了基类或称父类 CWnd 类的所 有特 性，但增加了自己的功能，实现拆分窗口，使窗口至少可被拆分成两个窗口，用户 可以移动两个窗口之间的边框来改变窗口的大小；CtoolBar 类可以定义工具栏等。MFC 命名的惯例是类的名字通常是由“C”打头；成员变量使用前缀“m_”，接着使用一个字母来指明数据类型，然后是变量的名称；所有的单词用大写字母开头。2.3 设计题目及要求（1） 题目：实现多边形和曲线的绘制和变换（2） 要求：学会使用VC+编写实现图形的绘制变换，需包括直线、曲线、多边形的绘制和变换，及三维立体图形的相应变换.2.4 总体流程图三、课程设计原理3.1 实现的算法 3.1.1 DDA算法画直线 DDA是数字微分分析式（Digital Differential Analyzer）的缩写。 已知直线两端点(x1,y1)、(x2,y2)则斜率m为：m = (y2-y1)/(x2-x1)= Dx/Dy;直线中的每一点坐标都可以由前一点坐标变化一个增量（Dx, Dy）而得到，即表示为递归式： xi+1=xi+Dx yi+1=yi+Dy 。递归式的初值为直线的起点（x1, y1），这样，就可以用加法来生成一条直线。具体算法是：该算法适合所有象限，其中用了用了两个函数如：Integer(-8.5)= -9; Integer(8.5) =8;Sign(i),根据i的正负，分别得到-1，0，+1；相应代码： /DDA DrawLine if(abs(x2-x1) abs(y2-y1) length = abs(x2-x1); else length = abs(y2-y1); Dx = (x2-x1)/length; Dy = (y2-y1)/length; x = x1+0.5*Sign(Dx); y = x2 + 0.5*Sign(Dy); i = 1; while(i SetPixel(x,y,color); while(x=xP) if(dSetPixel(x,y,color); x=a; y=0; d=4*(squarea-a*squareb)+squareb; pDC-SetPixel(x,y,color) ; while(yyP) if(dSetPixel(x,y,color);编写OnDraw函数如下：void CMy2_9View:OnDraw(CDC* pDC)CMy2_9Doc* pDoc = GetDocument();ASSERT_VALID(pDoc);MidPointEllipse(pDC,500,300,RGB(0,0,0);（2）中心点算法画椭圆我们先考虑圆心在原点的椭圆的生成，对于中心不是原点的椭圆，可以通过坐标的平移变换获得相应位置的椭圆。中心在原点。焦点在坐标轴上的标准椭圆具有X轴对称、Y轴对称和原点对称特性，已知椭圆上第一象限的P点坐标是(x, y)，则椭圆在另外三个象限的对称点分别是(x, -y)、(-x, y)和(-x, -y)。因此，只要画出第一象限的四分之一椭圆，就可以利用这三个对称性得到整个椭圆。相应代码：void MP_Ellipse(int xc , int yc , int a, int b) double sqa = a * a;double sqb = b * b;double d = sqb + sqa * (-b + 0.25);int x = 0;int y = b;EllipsePlot(xc, yc, x, y);while( sqb * (x + 1) sqa * (y - 0.5)if (d 0)if (d 0)d += sqb * (2 * x + 2) + sqa * (-2 * y + 3);x+; else d += sqa * (-2 * y + 3); y-;EllipsePlot(xc, yc, x, y);3.2 图形变换的基本原理 3.2.1 平移变换平移变换函数如下：void glTranslatefd(TYPE x, TYPE y, TYPE z)；三个函数参数就是目标分别沿三个轴向平移的偏移量。这个函数表示用于这三个偏移量生成的矩阵乘以当前矩阵。当参数是(0.0,0.0,0.0)时，表示对函数glTranslate*()的操作是单位矩阵，也就是对物体没有影响。 3.2.2 旋转变换旋转变换函数如下：Void glRotafdTYPE angle, TYPE x, TYPE y, TYPE z)； 函数中第一个参数是表示目标沿从点(x,y,z)到原点方向逆时针旋转的角度，后三个参数是旋转的方向点坐标。这个函数表示用这四个参数生成的矩阵乘以当前矩阵。当角度参数是0.0时，表示对物体没有影响。 3.2.3 比例变换比例变换函数如下：Void glScalefd(TYPE x, TYPE y, TYPE z)；单个函数参数值就是目标分别沿三个轴方向缩放的比例因子。这个函数表示用这三个比例因子生成的矩阵乘以当前矩阵。这个函数能完成沿相应的轴对目标进行拉伸、压缩和反射三项功能。以参数x为例，若当x大于1.0时，表示沿x方向拉伸目标；若x小于1.0，表示沿x轴方向收缩目标；若x=-1.0表示沿x轴反射目标。其中参数为负值时表示对目标进行相应轴的反射变换。四、总体设计与功能实现 4.1 主要界面设计 4.2 设置颜色界面 4.2.1 界面设置代码：void CGraphicsView:OnClock() WHAT_TO_DO=ID_CLOCK; clean();int xx = 450, yy = 300, r = 150,d = 5;int i, white = RGB (255,255,255);mile (xx, yy, r, COLOR);Matrix m (xx, 240), s (xx, 200);Matrix t1 (xx, yy, true), t2 (-xx, -yy, true), mr ( PI/1800 ), sr ( PI/30 );mile (m.getx (), m.gety (), d+1, COLOR);mile (s.getx (), s.gety (), d, COLOR);dne ( m.getx (), m.gety (), xx, yy, COLOR );dne ( s.getx (), s.gety (), xx, yy, COLOR );for (i=0;i120;i+):Sleep (80);mile (m.getx (), m.gety (), d+1, white);mile (s.getx (), s.gety (), d, white);dne ( m.getx (), m.gety (), xx, yy, white );dne ( s.getx (), s.gety (), xx, yy, white );m = t1*mr*t2*m;s = t1*sr*t2*s;mile (m.getx (), m.gety (), d+1, COLOR);mile (s.getx (), s.gety (),d, COLOR);dne ( m.getx (), m.gety (), xx, yy, COLOR );dne ( s.getx (), s.gety (), xx, yy, COLOR ); 4.2.2 点击“设置-颜色”后，运行结果如下：4.3 二维线画图元实现 4.3.1 实现代码：void CGraphicsView:MidCir(CDC *pdc, int x0, int y0, int x1, int y1, int color) int r,x,y,deltax,deltay,d;r=sqrt(double)x1-(double)x0)*(double)x1-(double)x0)+(double)y1-(double)y0)*(double)y1-(double)y0);x=0;y=r;deltax=3;deltay=2-r-r;d=1-r;while(xSetPixel(x+x0,y+y0,color);:Sleep(time);pdc-SetPixel(-x+x0,y+y0,color);:Sleep(time);pdc-SetPixel(x+x0,-y+y0,color);:Sleep(time);pdc-SetPixel(-x+x0,-y+y0,color);:Sleep(time);pdc-SetPixel(y+x0,x+y0,color);:Sleep(time);pdc-SetPixel(-y+x0,x+y0,color);:Sleep(time);pdc-SetPixel(y+x0,-x+y0,color);:Sleep(time);pdc-SetPixel(-y+x0,-x+y0,color);if(dSetPixelV(x+x0,y+y0,color);pdc-SetPixelV(x+x0,-y+y0,color);while(bb*(x+1)aa*(y-0.5) yy=y;if(d1SetPixelV(x+x0,y+y0,color);:Sleep(time);pdc-SetPixelV(-x+x0,y+y0,color);:Sleep(time);pdc-SetPixelV(x+x0,-y+y0,color);:Sleep(time);pdc-SetPixelV(-x+x0,-y+y0,color);d2=bb*(x+0.5)*(x+0.5)+aa*(y-1)*(y-1)-aa*bb;deltax-=bb;deltay+=aa;while(y0)if(d2SetPixelV(x+x0,y+y0,color);:Sleep(time);pdc-SetPixelV(-x+x0,y+y0,color);:Sleep(time);pdc-SetPixelV(x+x0,-y+y0,color);:Sleep(time);pdc-SetPixelV(-x+x0,-y+y0,color);void CGraphicsView:DDALine(CDC *pdc, int x0, int y0, int x1, int y1, int color)int xx,yy,s,s1,s2,di;float dx,dy,k,x,y;dx=x1-x0;if(dx=0) s1=1;else s1=-1;dy=y1-y0;if(dy=0) s2=1;elses2=-1;dx=abs(dx);dy=abs(dy);if(dx=dy) s=0;di=(int)dx;k=dy/dx*s2;elses=1;di=(int)dy;k=dx/dy*s1;x=x0;y=y0;for(int i=0;iSetPixel(xx,yy,color);x+=s1;y+=k;elsexx=(int)(x+0.5);yy=(int)y;:Sleep(time);pdc-SetPixel(xx,yy,color);y+=s2;x+=k; 4.3.2 点击二维线画图元，课相应画出直线、圆和椭圆，结果如下： 4.4 画多边形功能的实现 4.4.1 部分实现代码：void CGraphicsView:OnDrawDuoBX() Vertex_Count dlg;if(dlg.DoModal()=IDOK)if(dlg.m_vertex_countMAX)MessageBox(输入顶点数过大);return;VertexTotal=dlg.m_vertex_count;CDC *pDC=GetDC();CPen pen(PS_SOLID,2,RGB(255,255,255);CPen *pOldpen=pDC-SelectObject(&pen);pDC-MoveTo(int)(inVertexArray0.x+0.5),(int)(inVertexArray0.y+0.5);int i;for(i=1;iLineTo(int)(inVertexArrayi.x+0.5),(int)(inVertexArrayi.y+0.5);pDC-LineTo(int)(inVertexArray0.x+0.5),(int)(inVertexArray0.y+0.5);pDC-SelectObject(pOldpen);ReleaseDC(pDC);inLength=0;outLength=0;WHAT_TO_DO=ID_DrawDuoBX; 4.4.2 点击多边形，输入定点个数，可绘制出相应的多边形，结果如下： 4.5 画Bezier曲线功能的实现 4.5.1 部分实现代码：void CGraphicsView:OnBezier() / TODO: Add your command handler code hereWHAT_TO_DO=ID_BEZIER;CDC *p=GetDC ();p-TextOut (10, 20, PS:鼠标左键添加曲线,鼠标右键修改曲线.);ReleaseDC (p);void CGraphicsView:OnBezierClear() n = -1;RedrawWindow();void CGraphicsView:DrawBezier(DPOINT *p)if (n = 0) return;if(pn.x p0.x-1) & (pn.y p0.y-1)pDC-SetPixel(p0.x, p0.y, COLOR);return;DPOINT *p1;p1 = new DPOINTn+1;int i, j;p10 = p0;for(i=1; i=n; i+)for(j=0; j= 0 ) pointscurrent.x = point.x;pointscurrent.y = point.y;RedrawWindow();if(current2 = 0 ) pointscurrent2.x = point.x;pointscurrent2.y = point.y;RedrawWindow();break;default:break;CView:OnMouseMove(nFlags, point); 4.5.2 点击曲线-Beizer曲线，可实现Beizer曲线的绘制功能，绘制结果如下图： 图 1 图 2 4.5.3 点击曲线-Beizer曲线，可实现Beizer曲线的移动，鼠标点击其中的任一点，可实现曲线的移动，绘制结果如下图： 上图1移动后的曲线 上图2移动后的曲线4.6 二维图形变换的实现 可以实现一椭圆在界面上的随机移动，一圆在界面上饶某一点的旋转和一正方形由大变小在变大的变化，部分实现代码如下：void CGraphicsView:OnXuanzhuan() WHAT_TO_DO=ID_XUANZHUAN;time=0;OnClear();CClientDC dc(this);CDC* pDC=&dc;int i, white=RGB(255,255,255), point 22=300,200,300,250;Matrix a (point00,point01), b (point10,point11);int midx=(point00+point10)/2,midy=(point01+point11)/2;Matrix t1 (midx, midy,true), t2 (-midx, -midy,true); Matrix r (PI/50);Matrix temp (midx, midy,true);temp = t1*r*t2;for(i=0;i200;i+):Sleep(50);MidCir(pDC, a.getx(), a.gety(), b.getx(), b.gety(), white);a = temp*a;b = temp*b;MidCir(pDC, a.getx(), a.gety(), b.getx(), b.gety(), COLOR);for(i=0;iSetCheck(WHAT_TO_DO=ID_XUANZHUAN);void CGraphicsView:OnScale() WHAT_TO_DO=ID_SCALE;OnClear();CClientDC dc(this);CDC* pDC=&dc;time=0;int i,white=RGB(255,255,255), point42=300,250,400,250,300,300,400,300;float sx=0.9,sy=0.85;int midx=(point00+point30)/2,midy=(point01+point31)/2;Matrix s1 (sx,sy),s2 (1/sx,1/sy);Matrix t1 (midx, midy,true), t2 (-midx, -midy,true); Matrix a (point00,point01), b (point10,point11);Matrix c (point20,point21), d (point30,point31);Matrix temp (midx, midy,true);temp = t1*s1*t2;DDALine (pDC,a.getx(),a.gety(),b.getx(),b.gety(),COLOR);DDALine (pDC,a.getx(),a.gety(),c.getx(),c.gety(),COLOR);DDALine (pDC,c.getx(),c.gety(),d.getx(),d.gety(),COLOR);DDALine (pDC,d.getx(),d.gety(),b.getx(),b.gety(),COLOR);for(i=0;i20;i+):Sleep (30);DDALine (pDC,a.getx(),a.gety(),b.getx(),b.gety(),white);DDALine (pDC,a.getx(),a.gety(),c.getx(),c.gety(),white);DDALine (pDC,c.getx(),c.gety(),d.getx(),d.gety(),white);DDALine (pDC,d.getx(),d.gety(),b.getx(),b.gety(),white);a=temp*a;b=temp*b;c=temp*c;d=temp*d;DDALine (pDC,a.getx(),a.gety(),b.getx(),b.gety(),COLOR);DDALine (pDC,a.getx(),a.gety(),c.getx(),c.gety(),COLOR);DDALine (pDC,c.getx(),c.gety(),d.getx(),d.gety(),COLOR);DDALine (pDC,d.getx(),d.gety(),b.getx(),b.gety(),COLOR);temp = t1*s2*t2;for(i=0;iSetCheck(WHAT_TO_DO=ID_SCALE);4.7 三维图形的变换 主要实现三维图形的上下左右平移，分别绕X轴Y轴Z轴的旋转，放大和缩小，以及正方体六个面的颜色变换，除此之外，还可以选择背景颜色的改变 4.7.1 部分代码如下：void CGraphicsView:OnAoduomianti() WHAT_TO_DO=ID_AODUOMIANTI;CDrawDLG dlg1;dlg1.DoModal();void CGraphicsView:OnUpdateAoduomianti(CCmdUI* pCmdUI) pCmdUI-SetCheck(WHAT_TO_DO=ID_AODUOMIANTI); void CDrawDLG:OnPaint() CPaintDC dc(this); / device context for paintingCWnd *pWnd=GetDlgItem(IDC_DRAW);pWnd-UpdateWindow();/CDC *PDC=pWnd-GetDC();Draw();void CDrawDLG:Draw()CWnd *pWnd=GetDlgItem(IDC_DRAW);pWnd-UpdateWindow();CDC *pDC=pWnd-GetDC();CRect rect;pWnd-GetClientRect(rect);D v8=-fs,-fs,fs,-fs,fs,fs,fs,fs,fs,fs,-fs,fs,-fs,-fs,-fs,-fs,fs,-fs,fs,fs,-fs,fs,-fs,-fs,d8;POINT p04,p14,p24,p34,p44,p54,w8;int z8;for (int i=0; iGetDlgCtrlID();switch(nID)case IDC_SCROLLBAR1: a=pScrollBar-GetScrollPos(); switch (nSBCode) case SB_LINELEFT: a-;break;case SB_LINERIGHT: a+;break;case SB_PAGELEFT: a-=10;break;case SB_PAGERIGHT: a+=10;break;case SB_THUMBTRACK: a=nPos;break; if (a180)a=-180; pScrollBar-SetScrollPos(a); break;case IDC_SCROLLBAR2: b=pScrollBar-GetScrollPos(); switch (nSBCode) case SB_LINELEFT: b-;break;case SB_LINERIGHT: b+;break;case SB_PAGELEFT: b-=10;break;case SB_PAGERIGHT: b+=10;break;case SB_THUMBTRACK: b=nPos;break; if (b180)b=-180; pScrollBar-SetScrollPos(b); break;case IDC_SCROLLBAR3: c=pScrollBar-GetScrollPos(); switch (nSBCode) case SB_LINELEFT: c-;break;case SB_LINERIGHT: c+;break;case SB_PAGELEFT: c-=10;break;case SB_PAGERIGHT: c+=10;break;case SB_THUMBTRACK: c=nPos;break; if (c-180)c=180;