計算機圖形學(xué)課程設(shè)計--圖形繪制變換教案資料

1、計算機圖形學(xué)實驗報告課程名稱：計算機圖形學(xué)實驗名稱:圖形繪制與變換學(xué)院：電子信息工程學(xué)院專業(yè)：計算機科學(xué)與技術(shù)班級：11計科本01班學(xué)號：姓名：張慧指導(dǎo)教師：王征風(fēng)二零一四年目錄一、引言3二、設(shè)計需求3設(shè)計目標3設(shè)計環(huán)境3VC+3MFC4設(shè)計題目及要求4總體流程圖4三、課程設(shè)計原理4實現(xiàn)的算法4Bresenham算法畫直線5中心點算法畫圓和橢圓5圖形變換的基本原理7平移變換7旋轉(zhuǎn)變換7比例變換7四、總體設(shè)計與功能實現(xiàn)8主要界面設(shè)計8設(shè)置顏色界面8界面設(shè)置代碼8運行結(jié)果9二維線畫圖元實現(xiàn)9畫多邊形功能的實現(xiàn)13畫Bezier曲線功能的實現(xiàn)15二維圖形變換的實現(xiàn)18三維圖形的變換20五、實驗心得體

2、會、引言計算機圖形學(xué)(ComputerGraphics,簡稱CG)是一種使用數(shù)學(xué)算法將二維或三維圖形轉(zhuǎn)化為計算機顯示器的柵格形式的科學(xué)。簡單地說，計算機圖形學(xué)的主要研究內(nèi)容就是研究如何在計算機中表示圖形、以及利用計算機進行圖形的計算、處理和顯示的相關(guān)原理與算法。是計算機科學(xué)的一個分支領(lǐng)域，主要關(guān)注數(shù)字合成與操作視覺的圖形內(nèi)容。計算機圖形學(xué)研究的是應(yīng)用計算機產(chǎn)生圖像的所有工作，不管圖像是靜態(tài)的還是動態(tài)的，可交互的還是固定的，等等。圖形API是允許程序員開發(fā)包含交互式計算機圖形操作的應(yīng)用而不需要關(guān)注圖形操作細節(jié)或任務(wù)系統(tǒng)細節(jié)的工具集。計算機圖形學(xué)有著廣泛的應(yīng)用領(lǐng)域，包括物理、航天、電影、電視、游戲

3、、藝術(shù)、廣告、通信、天氣預(yù)報等幾乎所有領(lǐng)域都用到了計算機圖形學(xué)的知識，這些領(lǐng)域通過計算機圖形學(xué)將幾何模型生成圖像，將問題可視化從而為各領(lǐng)域更好的服務(wù)。計算機圖形學(xué)利用計算機產(chǎn)生讓人賞心悅目的視覺效果，必須建立描述圖形的幾何模型還有光照模型，再加上視角、顏色、紋理等屬性，再經(jīng)過模型變換、視圖變換、投影操作等，這些步驟從而實現(xiàn)一個完整的OpenGL程序效果。OpenGL是一個開放的三維圖形軟件包，它獨立于窗口系統(tǒng)和操作系統(tǒng)，以它為基礎(chǔ)開發(fā)的應(yīng)用程序可以十分方便地在各種平臺間移植。計算機圖形學(xué)通過應(yīng)用OpenGL的功能，使得生成的圖形效果具有高度真實感。學(xué)習(xí)計算機圖形學(xué)的重點是掌握OpenGL在圖形

4、學(xué)程序中的使用方法。事實上，圖形學(xué)也把可以表示幾何場景的曲線曲面造型技術(shù)和實體造型技術(shù)作為其主要的研究內(nèi)容。同時，真實感圖形計算的結(jié)果是以數(shù)字圖像的方式提供的，計算機圖形學(xué)也就和圖像處理有著密切的關(guān)系。通過21世紀是信息的時代，在日新月異的科技更新中相信計算機會發(fā)揮越來越重要的作用，計算機圖形學(xué)也會在更多的領(lǐng)域所應(yīng)用，雖然我國在這方面還比較薄弱，但相信會有越來越好的時候的。設(shè)計需求設(shè)計目標以圖形學(xué)算法為目標，深入研究。繼而策劃、設(shè)計并實現(xiàn)一個能夠表現(xiàn)計算機圖形學(xué)算法原理的或完整過程的演示系統(tǒng)，并能從某些方面作出評價和改進意見。通過完成一個完整程序，經(jīng)歷策劃、設(shè)計、開發(fā)、測試、總結(jié)和驗收各階段，

5、達到：鞏固和實踐計算機圖形學(xué)課程中的理論和算法；學(xué)習(xí)表現(xiàn)計算機圖形學(xué)算法的技巧；培養(yǎng)認真學(xué)習(xí)、積極探索的精神。設(shè)計環(huán)境VC+VC+是Microsoft公司推出的一個基于Windows系統(tǒng)平臺、可視化的集成開發(fā)環(huán)境，它的源程序按C+語言的要求編寫，并加入了微軟提供的功能強大的MFC(MicrosoftFoundationClass)類庫。MFC中圭寸裝了大部分WindowsAPI函數(shù)和Windows控件，它包含的功能涉及到整個Windows操作系統(tǒng)。MFC不僅給用戶提供了Windows圖形環(huán)境下應(yīng)用程序的框架，而且還提供了創(chuàng)建應(yīng)用程序的組件，這樣，開發(fā)人員不必從頭設(shè)計創(chuàng)建和管理一個標準Windo

6、ws應(yīng)用程序所需的程序，而是從一個比較高的起點編程，故節(jié)省了大量的時間。另夕卜，它提供了大量的代碼，指導(dǎo)用戶編程時實現(xiàn)某些技術(shù)和功能。因此，使用VC+提供的高度可視化的應(yīng)用程序開發(fā)工具和MFC類庫，可使應(yīng)用程序開發(fā)變得簡單。MFCMFC(MicrosoftFoundationClasses)，是一個微軟公司提供的類庫(classlibraries)以C+類的形式封裝了Windows的API，它包含了窗口等許多類的定義。各種類的集合構(gòu)成了一個應(yīng)運程序的框架結(jié)構(gòu)，以減少應(yīng)用程序開發(fā)人員的工作量。其中包含的類包含大量Windows句柄封裝類和很多Windows的內(nèi)建控件和組件的封裝類。MFC版本封裝

7、了大約200個類，其中的一些可以被用戶直接使用。例如CWnd類封裝了窗口的功能，包括打印文本、繪制圖形及跟蹤鼠標指針的移動等；CsplitterWnd類是從CWnd類派生出來的，繼承了基類或稱父類CWnd類的所有特性，但增加了自己的功能，實現(xiàn)拆分窗口，使窗口至少可被拆分成兩個窗口，用戶可以移動兩個窗口之間的邊框來改變窗口的大小；CtoolBar類可以定義工具欄等。MFC命名的慣例是類的名字通常是由“C”打頭；成員變量使用前綴“m_”，接著使用一個字母來指明數(shù)據(jù)類型，然后是變量的名稱；所有的單詞用大寫字母開頭。設(shè)計題目及要求(1) 題目：實現(xiàn)多邊形和曲線的繪制和變換(2) 要求：學(xué)會使用VC+編

8、寫實現(xiàn)圖形的繪制變換，需包括直線、曲線、多邊形的繪制和變換，及三維立體圖形的相應(yīng)變換總體流程圖三、課程設(shè)計原理實現(xiàn)的算法DDA算法畫直線DDA是數(shù)字微分分析式(DigitalDifferentialAnalyzer)的縮寫。已知直線兩端點(x1,y1)、(x2,y2)則斜率m為：m=(y2-y1)/(x2-x1)=Dx/Dy;直線中的每一點坐標都可以由前一點坐標變化一個增量(Dx,Dy)而得到，即表示為遞歸式：xi+1=xi+Dxyi+1=yi+Dy。遞歸式的初值為直線的起點（x1,y1），這樣，就可以用加法來生成一條直線。具體算法是：該算法適合所有象限，其中用了用了兩個函數(shù)如：Integer

9、=-9;Integer=8;Sign(i),根據(jù)i的正負，分別得到-1，0,+1；相應(yīng)代碼：1畫起點（x1,y1）.2.準備畫下個點。x坐標增1,判斷如果達到終點，則完成。否則，由圖中可知,下個要畫的點要么為當前點的右鄰接點，要么是當前點的右上鄰接點如果線段ax+by+c=O與x=x1+1的交點的y坐標大于M點的y坐標的話，下個點為U（x1+1,y1+1）,否則，下個點為B（x1+1,y1）,3.畫點（U或者B）.4.跳回第2步.5結(jié)束中心點算法畫圓和橢圓（1）中心點算法畫圓在一個方向上取單位間隔，在另一個方向的取值由兩種可能取值的中點離圓的遠近而定。實際處理中，用決策變量的符號來確定象素點的

10、選擇，因此算法效率較高。生成圓弧的中點算法和上面講到的生成直線段的中點算法類似?？紤]第一象限內(nèi)x0,R/、2的八分之一圓弧段。經(jīng)過計算，得出判別式的遞推公式為:di2x3di2(xyj5這兩個遞推公式的初值條件為:(x0,y,r)(0,R)d05/4R編寫成員函數(shù)如下：voidCMy2_9View:MidPointEllipse(CDC*pDC,doublea,doubleb,intcolor)doublex,y,d,xP,yP,squarea,squareb;squarea=a*a;squareb=b*b;xP=(int)+(double)squarea/sqrt(double)(squar

11、ea+squareb);yP=(int)+(double)squareb/sqrt(double)(squarea+squareb);x=0;y=b;d=4*(squareb-squarea*b)+squarea;pDC-SetPixel(x,y,color);while(x=xP)if(dSetPixel(x,y,color);x=a;y=o；d=4*(squarea-a*squareb)+squareb;pDC-SetPixel(x,y,color);while(yvyP)if(dSetPixel(x,y,color);編寫OnDraw函數(shù)如下：voidCMy2_9View:OnDraw(

12、CDC*pDC)CMy2_9Doc*pDoc=GetDocument();ASSERT_VALID(pDoc);MidPointEllipse(pDC,500,300,RGB(0,0,0);(2)中心點算法畫橢圓我們先考慮圓心在原點的橢圓的生成，對于中心不是原點的橢圓，可以通過坐標的平移變換獲得相應(yīng)位置的橢圓。中心在原點。焦點在坐標軸上的標準橢圓具有X軸對稱、Y軸對稱和原點對稱特性，已知橢圓上第一象限的P點坐標是(x,y)，則橢圓在另外三個象限的對稱點分別是(x,-y)、(-x,y)和(-x,-y)。因此，只要畫出第一象限的四分之一橢圓，就可以利用這三個對稱性得到整個橢圓。相應(yīng)代碼：voidM

13、P_Ellipse(intxc,intyc,inta,intb)doublesqa=a*a;doublesqb=b*b;doubled=sqb+sqa*(-b+;intx=0;inty=b;EllipsePlot(xc,yc,x,y);while(sqb*(x+1)sqa*(y-)if(d0)if(d0)d+=sqb*(2*x+2)+sqa*(-2*y+3);x+;elsed+=sqa*(-2*y+3);y-;EllipsePlot(xc,yc,x,y);圖形變換的基本原理平移變換平移變換函數(shù)如下：voidglTranslatefd(TYPEx,TYPEy,TYPEz)；三個函數(shù)參數(shù)就是目標分

14、別沿三個軸向平移的偏移量。這個函數(shù)表示用于這三個偏移量生成的矩陣乘以當前矩陣。當參數(shù)是,時，表示對函數(shù)glTranslate*()的操作是單位矩陣，也就是對物體沒有影響。旋轉(zhuǎn)變換旋轉(zhuǎn)變換函數(shù)如下：VoidglRotafdTYPEangle,TYPEx,TYPEy,TYPEz)；函數(shù)中第一個參數(shù)是表示目標沿從點(x,y,z)到原點方向逆時針旋轉(zhuǎn)的角度，后三個參數(shù)是旋轉(zhuǎn)的方向點坐標。這個函數(shù)表示用這四個參數(shù)生成的矩陣乘以當前矩陣。當角度參數(shù)是時，表示對物體沒有影響。比例變換比例變換函數(shù)如下：VoidglScalefd(TYPEx,TYPEy,TYPEz)；單個函數(shù)參數(shù)值就是目標分別沿三個軸方向縮放

15、的比例因子。這個函數(shù)表示用這三個比例因子生成的矩陣乘以當前矩陣。這個函數(shù)能完成沿相應(yīng)的軸對目標進行拉伸、壓縮和反射三項功能。以參數(shù)x為例，若當x大于時，表示沿x方向拉伸目標；若x小于，表示沿x軸方向收縮目標；若x=表示沿x軸反射目標。其中參數(shù)為負值時表示對目標進行相應(yīng)軸的反射變換。四、總體設(shè)計與功能實現(xiàn)主要界面設(shè)計設(shè)置顏色界面界面設(shè)置代碼：voidCGraphicsView:OnClock()WHAT_TO_DO=ID_CLOCK;clean();intxx=450,yy=300,r=150,d=5;inti,white=RGB(255,255,255);mile(xx,yy,r,COLOR)

16、;Matrixm(xx,240),s(xx,200);Matrixt1(xx,yy,true),t2(-xx,-yy,true),mr(PI/1800),sr(PI/30);mile(),(),d+1,COLOR);mile(),(),d,COLOR);dne(),(),xx,yy,COLOR);dne(),(),xx,yy,COLOR);for(i=0;i120;i+):Sleep(80);mile(),(),d+1,white);mile(),(),d,white);dne(),(),xx,yy,white);dne(),(),xx,yy,white);m=t1*mr*t2*m;s=t1*

17、sr*t2*s;mile(),(),d+1,COLOR);mile(),(),d,COLOR);dne(),(),xx,yy,COLOR);dne(),(),xx,yy,COLOR);點擊“設(shè)置-顏色”后，運行結(jié)果如下：二維線畫圖元實現(xiàn)實現(xiàn)代碼：voidCGraphicsView:MidCir(CDC*pdc,intx0,inty0,intx1,inty1,intcolor)intr,x,y,deltax,deltay,d;r=sqrt(double)x1-(double)x0)*(double)x1-(double)x0)+(double)y1-(double)y0)*(double)y1-

18、(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)

19、;: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*)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);:S

20、leep(time);pdc-SetPixelV(-x+x0,-y+y0,color);d2=bb*(x+*(x+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);voidCGraphicsView:DDALi

21、ne(CDC*pdc,intx0,inty0,intx1,inty1,intcolor)intxx,yy,s,s1,s2,di;floatdx,dy,k,x,y;dx=x1-x0;if(dx=0)s1=1;elses1=-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(inti=0;iSetPixel(xx,yy,color);x+=s1;y+=k;elsexx=(int)(

22、x+;yy=(int)y;:Sleep(time);pdc-SetPixel(xx,yy,color);y+=s2;x+=k;點擊二維線畫圖元，課相應(yīng)畫出直線、圓和橢圓，結(jié)果如下：畫多邊形功能的實現(xiàn)部分實現(xiàn)代碼：voidCGraphicsView:OnDrawDuoBX()Vertex_Countdlg;if()=IDOK)ifMAX)MessageBox(輸入頂點數(shù)過大);return;VertexTotal=;CDC*pDC=GetDC();CPenpen(PS_SOLID,2,RGB(255,255,255);CPen*pOldpen=pDC-SelectObject(&pen);pDC

23、-MoveTo(int)(inVertexArray0.x+,(int)(inVertexArray0.y+);inti;for(i=1;iLineTo(int)(inVertexArrayi.x+,(int)(inVertexArrayi.y+);pDC-LineTo(int)(inVertexArray0.x+,(int)(inVertexArray0.y+);pDC-SelectObject(pOldpen);ReleaseDC(pDC);inLength=0;outLength=0;WHAT_TO_DO=ID_DrawDuoBX;點擊多邊形，輸入定點個數(shù)，可繪制出相應(yīng)的多邊形，結(jié)果如下

24、：畫Bezier曲線功能的實現(xiàn)部分實現(xiàn)代碼：voidCGraphicsView:OnBezier()JReleaseDC(p);voidCGraphicsView:OnBezierClear()n=-1;RedrawWindow();voidCGraphicsView:DrawBezier(DPOINT*p)if(n=0)return;if(pn.xp0.x-1)&(pn.yp0.y-1)pDC-SetPixel(p0.x,p0.y,COLOR);return;DPOINT*p1;p1=newDPOINTn+1;inti,j;p10=p0;for(i=1;i=n;i+)for(j=0;j=0)

25、pointscurrent.x=;pointscurrent.y=;RedrawWindow();if(current2=0)pointscurrent2.x=;pointscurrent2.y=;RedrawWindow();break;default:break;CView:OnMouseMove(nFlags,point);點擊曲線-Beizer曲線，可實現(xiàn)Beizer曲線的繪制功能，繪制結(jié)果如下圖：圖1圖2點擊曲線-Beizer曲線，可實現(xiàn)Beizer曲線的移動，鼠標點擊其中的任一點，可實現(xiàn)曲線的移動，繪制結(jié)果如下圖：圖1移動后的曲線上圖2移動后的曲線二維圖形變換的實現(xiàn)可以實現(xiàn)一橢圓在

26、界面上的隨機移動，一圓在界面上饒某一點的旋轉(zhuǎn)和一正方形由大變小在變大的變化，部分實現(xiàn)代碼如下：voidCGraphicsView:OnXuanzhuan()WHAT_TO_DO=ID_XUANZHUAN;time=0;OnClear();CClientDCdc(this);CDC*pDC=&dc;inti,white=RGB(255,255,255),point22=300,200,300,250;Matrixa(point00,point01),b(point10,point11);intmidx=(point00+point10)/2,midy=(point01+point11)/2;Ma

27、trixt1(midx,midy,true),t2(-midx,-midy,true);Matrixr(PI/50);Matrixtemp(midx,midy,true);temp=t1*r*t2;for(i=0;i200;i+):Sleep(50);MidCir(pDC,(),(),(),(),white);a=temp*a;b=temp*b;MidCir(pDC,(),(),(),(),COLOR);for(i=0;iSetCheck(WHAT_TO_DO=ID_XUANZHUAN);voidCGraphicsView:OnScale()WHAT_TO_DO=ID_SCALE;OnClea

28、r();CClientDCdc(this);CDC*pDC=&dc;time=0;inti,white=RGB(255,255,255),point42=300,250,400,250,300,300,400,300;floatsx=,sy=;intmidx=(point00+point30)/2,midy=(point01+point31)/2;Matrixs1(sx,sy),s2(1/sx,1/sy);Matrixt1(midx,midy,true),t2(-midx,-midy,true);Matrixa(point00,point01),b(point10,point11);Matri

29、xc(point20,point21),d(point30,point31);Matrixtemp(midx,midy,true);temp=t1*s1*t2;DDALine(pDC,(),(),(),(),COLOR);DDALine(pDC,(),(),(),(),COLOR);DDALine(pDC,(),(),(),(),COLOR);DDALine(pDC,(),(),(),(),COLOR);for(i=0;i20;i+):Sleep(30);DDALine(pDC,(),(),(),(),white);DDALine(pDC,(),(),(),(),white);DDALine(

30、pDC,(),(),(),(),white);DDALine(pDC,(),(),(),(),white);a=temp*a;b=temp*b;c=temp*c;d=temp*d;DDALine(pDC,(),(),(),(),COLOR);DDALine(pDC,(),(),(),(),COLOR);DDALine(pDC,(),(),(),(),COLOR);DDALine(pDC,(),(),(),(),COLOR);temp=t1*s2*t2;for(i=0;iSetCheck(WHAT_TO_DO=ID_SCALE);三維圖形的變換主要實現(xiàn)三維圖形的上下左右平移，分別繞X軸Y軸Z軸的

31、旋轉(zhuǎn)，放大和縮小，以及正方體六個面的顏色變換，除此之外，還可以選擇背景顏色的改變部分代碼如下：voidCGraphicsView:OnAoduomianti()WHAT_TO_DO=ID_AODUOMIANTI;CDrawDLGdlg1;();voidCGraphicsView:OnUpdateAoduomianti(CCmdUI*pCmdUI)pCmdUI-SetCheck(WHAT_TO_DO=ID_AODUOMIANTI);voidCDrawDLG:OnPaint()CPaintDCdc(this);=vi.x;di.y=(int)(vi.y*cos(a*DU)-vi.z*sin(a*D

32、U);di.z=(int)(vi.y*sin(a*DU)+vi.z*cos(a*DU);vi.x=(int)(di.x*cos(b*DU)+di.z*sin(b*DU);vi.y=di.y;vi.z=(int)(di.z*cos(b*DU)-di.x*sin(b*DU);di.x=(int)(vi.x*cos(c*DU)-vi.y*sin(c*DU);di.y=(int)(vi.x*sin(c*DU)+vi.y*cos(c*DU);di.z=vi.z;wi.x=di.x+cx;wi.y=di.y+cy;zi=di.z;p00=w0;p01=w1;p02=w2;p03=w3;p10=w4;p11

33、=w5;p12=w6;p13=w7;p20=w0;p21=w1;p22=w5;p23=w4;p30=w1;p31=w2;p32=w6;p33=w5;p40=w2;p41=w3;p42=w7;p43=w6;p50=w0;p51=w3;p52=w7;p53=w4;switch(Maxnum(z,7)case0:fill(p0,p2,p5,0,2,5);break;case1:fill(p0,p2,p3,0,2,3);break;case2:fill(p0,p3,p4,0,3,4);break;case3:fill(p0,p4,p5,0,4,5);break;case4:fill(p1,p2,p5,

34、1,2,5);break;case5:fill(p1,p2,p3,1,2,3);break;case6:fill(p1,p3,p4,1,3,4);break;case7:fill(p1,p4,p5,1,4,5);break;BOOLCDrawDLG:OnInitDialog()CDialog:OnInitDialog();(-180,180);(0);(-180,180);(0);(-180,180);(0);(0,350);(200);(0,300);(115);a=b=c=0;fs=;SetTimer(1,100,NULL);Ctrl=0;cx=200;cy=115;COLOR1=RGB(123,234,43);COLOR2=RGB(123,123,0);COLOR3=RGB(123,24,235);COLOR4=RGB(0,123,95);COLOR5=RGB(23,234,34);COLOR6=RGB(234,124,0);COL