小型绘图系统

《小型绘图系统》由会员分享，可在线阅读，更多相关《小型绘图系统（24页珍藏版）》请在装配图网上搜索。

1、实验报告计算机图形学实验大作业 课程名称 计算机图形学 实验名称 二维绘图与计算机动画 姓 名 学 号 专业班级 数媒1002 成 绩 指导教师 爨莹 实 验 报 告课程名称 计算机图形学 实验名称 小型绘图系统 姓 名 学 号 专业班级 数媒1002 实验日期 20112 年 12 月 6 日 成绩 指导教师 爨莹 一、实验目的1熟悉计算机图形的生成算法2用编程的方法实现计算机的生成算法3巩固计算机图形学中学到的一些理论知识二、实验环境 软件：windows7 系统 三、实验内容与步骤(可提供屏幕抓图)1）绘制直线 （1）DDA 算法的原理 DDA算法是根据直线的微分方程来计算x或y生成直线

2、的扫描转换算法。 在一个坐标轴上以单位间隔对线段取样, 以决定另一个坐标轴方向上最靠近理想线段的整数值。 设(x0, y0)为直线段的始点, (x1, y1)为直线段的终点, 且端点坐标均为整数, 则直线的微分方程为 设|k|1, 则有 yi+1=kxi+1+b=k(xi+x)+b=yi+kx上式表明, 若x=1, 则当x每递增1时, y递增k。 扫描转换开始时, 取直线始点(x0, y0)作为初始坐标。 程序代码： void DDA-line(x0, y0, x1, y1, color) int x0, y0, x1, y1, color; int x; float y, k, deltx,

3、 delty; deltx=x1-x0; delty=y1-y0; k=deltydeltx; y=y0; for(x=x0; x=x1; x+) putpixel(x, int(y+0.5), clolor); y=y+k; 实现截图 DDA算法绘制直线 （2）中点法l 算法的原理为了讨论的方便, 假定直线的斜率在01之间, 其它情况参照下述讨论进行处理。 假设直线的起点和终点分别为(x0, y0)和(x1, y1), 则直线方程为 F(x, y)=ax+by+c=0其中, a=y0-y1, b=x1-x0, c=x0y1-x1y0。 对于直线上的点, F(x,y)=0; 对于直线上方的点,

4、 F(x,y)0; 而对于直线下方的点, F(x,y)0。 如图3.1所示, 若直线在x方向上增加一个单位, 则在y方向上的增量只能在0和1之间。 假设横坐标为xP的各像素点中最佳逼近于理想直线的像素为(xP,yP), 用实心小圆表示。 那么, 下一个与直线最近的像素只能是正右方的P1(xP+1,yP)或右上方的P2(xP+1, yP+1)两者之一, 用空心小圆表示。 我们用P1和P2的中点M(xP+1, yP+0.5)与理想直线的位置关系来判定。 中点画线示意图l 程序void MidPoint-Line(x0, y0, x1, y1, color) int x0, y0, x1, y1,

5、color; int a, b, delta1, delta2, d, x, y; a=y0-y1; b=x1-x0; d=2*a+b delta1=2*a; x=x0; y=y0; putpixel(x, y, color); while(xx1) if(d0) x+; y+; d+=delta2; else x+; d+=delta1; putpixel(x, y, color); l 实现截图 （3）Bresenham算法l 算法的原理Bresenham画线算法与中点画线法有相似之处, 也是通过在每列像素中确定与理想直线最近的像素来进行直线的扫描转换的。 为了讨论的方便,不妨也假定直线的

6、斜率在01之间。 如图所示, 过各行、 各列像素中心构造一组虚拟网格线, 按直线从起点到终点的顺序计算直线与各垂直网格线的交点, 然后确定该列像素中与该交点最近的像素。 Bresenham算法误差项d的几何意义l 程序class drawings implements Serializable/父类，基本图形单元，用到串行化接口，保存时所用 int x1, y1, x2, y2; /定义坐标属性 int R, G, B; /定义色彩属性 float stroke; /定义线条粗细属性 int type; /定义字体属性 String s1; String s2; /定义字体风格属性 void

7、draw(Graphics2D g2d) ;/定义绘图函数 public void BresenhamLine(Graphics g,int x1,int y1,int x2,int y2) throws Exception int x,y,dx,dy,e; dx=x2-x1; dy=y2-y1; e=-dx; x=x1; y=y1; while(x0) y+; e=e-2*dx; class Line extends drawings /直线类 void draw(Graphics2D g2d) g2d.setPaint(new Color(R, G, B); g2d.setStroke(n

8、ew BasicStroke(stroke, BasicStroke.CAP_ROUND, BasicStroke.JOIN_BEVEL); g2d. BresenhamLine (g2d ，x1,y1,x2,y2); l 实现截图 2）圆l 算法的原理为了讨论的方便, 我们考虑中心在原点, 半径为R的圆的第二个八分圆弧, 圆的其它部分可通过一系列的简单的反射变换得到。 也就是讨论如何从(0, R)到 (R / ,R/ )顺时针确定最佳逼近于该圆弧的像素序列。 中心在原点, 半径为R的圆的方程为 x2+y2=R2 若令F(x,y)=x2+y2-R2, 则上述方程为 F(x, y)=0如图所示,

9、 假定x坐标为xP的像素中最佳逼近理想圆弧的为P(xP, yP), 那么, 下一个像素只能是正右方的P1(xP+1, yP)或右下方的P2(xP+1, yP-1)两者之一。 引入P1和P2的中点M(xP+1, yP-0.5), 当M在圆内时, 应取P1(xP+1, yP)为下一个像素, 否则, 应取P2(xP+1, yP-1)为下一个像素。 为此, 构造判别式 d=F(M)=F(xP+1, yP-0.5)=(xP+1)2+(yP-0.5)2-R2 中点画圆法 若d=0) putpixel(x, y, color); if(delta0) delta1=2*(delta+y)-1; if(del

10、ta10) delta2=2*(delta-x)-1; if(delta2=0) direction=2; else direcion=3; else direction=2; switch(direction) case 1:x+; delta+=2*x+1; break; case 2: x+; y-; delta+=2*(x-y+1) break; case 3: y-; delta+=(-2*y+1); break; 程序截图 绘制圆3）椭圆 l 算法的原理中点画圆法可以推广到一般二次曲线的生成, 下面以中心在原点的标准椭圆的扫描转换为例说明。 设椭 圆的方程为 F(x,y)=b2x2

11、+a2y2-a2b2=0其中, a为沿x轴方向的长半轴长度, b为y轴方向的短半轴长度, a、 b均为整数。 不失一般性, 我们只讨论第一象限椭圆弧的生成。需要注意的是, 在处理这段椭圆时, 必须以弧上斜率为-1的点(即法向量两个分量相等的点)作为分界把它分为上部分和下部分, 如图所示。 第一象限的椭圆弧 该椭圆上一点(x, y)处的法向量为 其中, i和j分别为沿x轴和y轴方向的单位向量。 从图3.6可看出, 在上部分, 法向量的y分量更大, 而在下部分, 法向量的x分量更大, 因而, 在上部分若当前最佳逼近理想椭圆弧的像素(xP,yP)满足下列不等式 b2(xP+1)a2(yP-0.5)

12、而确定的下一个像素不满足上述不等式, 则表明椭圆弧从上部分转入下部分。 在上部分, 假设横坐标为xP的像素中与椭圆弧更接近点是(xP, yP), 那么下一对候选像素的中点是(xP+1, yP-0.5)。 因此判别式为 d1=F(xP+1, yP-0.5)=b2(xP+1)2+a2(yP-0.5)2-a2b2 若d10, 中点在椭圆内, 则应取正右方像素, 且判别式应更新为 d1=F(xP+2, yP-0.5)=b2(xP+2)2+a2(yP-0.5)2-a2b2 =d1+b2(2xP+3) 当d10, 中点在椭圆之外, 这时应取右下方像素, 并且更新判别式为d1=F(xP+2, yP-1.5)

13、=b2(xP+2)2+a2(yP-1.5)2-a2b2 =d1+b2(2xP+3)+a2(-2yP+2) 由于弧起点为(0, b), 因此, 第一中点是(1, b-0.5), 对应的判别式是 d10=F(1, b-0.5)=b2+a2(b-0.5)2-a2b2 =b2+a2(-b+0.25) 在下部分, 应改为从正下方和右下方两个像素中选择下一像素。 如果在上部分所选择的最后一像素是(xP, yP), 则下部分的中点判别式d2的初始值为 d20=F(xP+0.5, yP-1)=b2(xP+0.5)2+a2(yP-1)2-a2b2 d2在正下方向与右下方向的增量计算与上部分类似, 这里不再赘述。

14、 下部分弧的终止条件是y=0。 l 程序程序代码： void MidpointEllipse(a, b, color) int a, b, color; int x, y; float d1, d2; x=0; y=b; d1=b*b+a*a*(-b+0.25); putpixel(x, y, color); while(b*b*(x+1)a*a(y-0.5) if(d10) if(d20) d2+=b*b(2*x+2)+a*a*(-2*y+3); x+; y-; else d2+=a*a*(-2*y+3); y-; putpixel(x, y, color); l 实现截图 绘制椭圆4）曲线

15、 （1）三次Bezier曲线的绘制l 算法的原理Bzier曲线是法国雷诺汽车公司的工程师Pierre Bzier于1962年提出的, 它将函数逼近同几何表示结合起来, 目的在于使设计师在计算机上能得心应手地绘图。 Bzier曲线在各种CAD系统中有广泛的应用。 假设给出n+1个控制点的位置矢量Pi(i=0, 1, 2, , n), 则n次Bzier多项式函数为由控制点Pi(i=0, 1, 2, , n)中相邻两点的连线构成的折线集称为Bzier特征多边形。 Bzier曲线的形状逼近于特征多边形的形状, 起点和终点与多边形的起点、 终点重合， 且多边形的第一条边和最后一条边表示了曲线在起点和终点

16、处的切矢量方向。 Bi,n(t)是Bernstein基函数, 也是Bzier曲线的调和函数。 Bzier曲线的性质由它的调和函数所决定。 如图7所示的是一条三次Bzier曲线。 图8三次Bzier曲线 三次Bzier曲线算法实现公式：l 实现截图 （ 输入参数、 输出图形 ）输入： 从输入界面中输入四个控制点，坐标任意：输出： 三次Bzier曲线（2）三次B样条曲线的绘制l 算法的原理已知n+1个控制点Pi(i=0, 1, , n), 则k次(k+1阶)B样条曲线的表达式是其中, Ni,k(u)是调和函数, 也称之为基函数, 由Schoenberg提出， 其递归定义为(tkutn+1) l 实

17、现截图 （ 输入参数、 输出图形 ）输入： 从输入界面中输入四个控制点：P0（220,350），P1（280，180），P2（300,170），P3（500，3）。输出： 三次B样条曲线的绘制5）二维变换（1）平移 程序：public void setpingyi() String input1; input1=JOptionPane.showInputDialog( 请输入x平移的量 ); m=Float.parseFloat(input1); String input2; input2=JOptionPane.showInputDialog( 请输入y平移的量 ); l=Float.par

18、seFloat(input2); a=1; b=0; c=0; d=1; 实验截图： (2)缩放程序：public void setsuofang() String input; input=JOptionPane.showInputDialog( 请输入x的缩放比例 ); a=Float.parseFloat(input); String input1; input1=JOptionPane.showInputDialog( 请输入y的缩放比列 ); d=Float.parseFloat(input1); m=313*(1-a); b=0; c=0; l=240*(1-d); 实验截图：（3

19、）旋转程序：public void xuanzhuang() String input; input=JOptionPane.showInputDialog( 请输入旋转角度 ); float o=Float.parseFloat(input); a=(float)(Math.cos(o*Math.PI/180); d=(float)(Math.cos(o*Math.PI/180); m=313*(1-(float)(Math.cos(o*Math.PI/180)+ 240*(1-(float)(Math.sin(o*Math.PI/180); b=(float)(Math.sin(o*Mat

20、h.PI/180); c=-(float)(Math.sin(o*Math.PI/180); l=240*(1-(float)(Math.cos(o*Math.PI/180)- 313*(1-(float)(Math.sin(o*Math.PI/180); 实验截图：四、实验结果与分析1. 实验结果： 完成的程序界面效果如下所示： 1. 实验分析通过本次绘图系统的设计，使我能够进一步了解绘图系统基本图形绘制的算法。五、问题与建议 问题： 由于自己能力有限，在有些时候还需要同学的帮助，或者搜集资料参考文献，不能真正的独立完成设计，通过不断调试系统中还是存在一些不足之处。 建议： 本次课程设计使我

21、加深了对课堂所学到的东西的印象，对以后我的学习有很大意义，今后我将更加努力学习，使自己的专业知识尽量完善。实 验 报 告课程名称 计算机图形学 实验名称 动画 姓 名 亢先卫 学 号 201007120206 专业班级 数媒1002 实验日期 2012 年 12 月 6 日 成绩 指导教师 爨莹 一、实验目的 1. 熟悉并掌握flash5.5常用工具，按钮，能练做出小的flash动画.二、实验环境1） 硬件 windows72） 软件 flash 5.5三、实验内容与步骤(可提供屏幕抓图)1） 创意简介以秋为背景，写出，画出自己对秋最真实的感触！2） 实现手段运用flash5.5做出效果图3） 屏幕截图 渐变四、问题与建议本次课程设计使我加深了对课堂所学到的东西的印象，对以后我的学习有很大意义，今后我将更加努力学习，使自己的专业知识尽量完善