1. Additional Drawing Tools
455

2. Graph of a function again
Suppose that real function is defined with formula y=e-t.cos(2πt) and we need to visualize its graph.
Transformation of world coordinates to screen coordinates can be defined implicitly by means of world window and viewport.

3. World Window
World Window is defined by instructions: glMatrixMode(GL_PROJECTION);
glLoadIdentity(); //initialization of transformation (reset)
gluOrtho2D(-2.0,4.0,-4.0,4.0); // new world window
(4.0,4.0)
(0,0)
(-2.0,-4.0)

4. World Window World Window definition: gluOrtho2D(-2.0,4.0,-4.0,4.0);
min x
max x
min y
max y

5. World Window to Screen Transformation: x’=Ax + B y’=Cy +D (4,4)
(640,480)
World Window
Screen
(0,0)
(-2,-4)
Transformation:
x’=Ax + B
y’=Cy +D

6. Window – Viewport transformation
Viewport definition glViewport(240,0,240,480);
min x
min y
x=max x -min x
y=max y -min y

7. Window to Viewport transformation
(4,4)
(640,480)
World Window
Viewport
(0,0)
(-2,-4)
Transformation:
x’=Ax + B
y’=Cy +D

8. Window – Viewport transformation
(0,480)
(240,480)
(480,480)
(640,480)
480
Viewport
480
(240,0)
(480, 0)
(640,0)
(0,0)
glViewport(240,0,240,480);

9. Window – Viewport transformation
Example. Find coefficients of transformation corresponding to gluOrtho2D(-2.0,4.0,-4.0,4.0); glViewport(240,0,240,480);
A(max(x)-min(x))=max(x’)-min(x’) C(max(y)-min(y))=max(y’)-min(y’) A=240/( ) = 240/6= 40 C=480/( ) = 480/8= 60

10. Window – Viewport transformation
Example. (contd) point (-2.0,-4.0) is mapped to (240,0)
240=A*(-2.0) +B=40*(-2.0)+B=-80 +B 0=C*(-4.0) +D=60*(-4.0)+D=-240 +D
B=320 D=240
Coordinates of point (0,0) in WorldWindow are (320,240) in theViewport

11. Window – Viewport transformation
gluOrtho2D(left,right,bottom,top);
Changing the value of parameters changes the size of the image.
World window
gluOrtho2D(left/2,right/2,bottom/2,top/2) makes all objects on the screen twice larger.
The size of image can be changed by choosing just a part of screen window.

12. Zooming
Effect of zooming is possible to achieve by changing the size of world window or viewport
xmax,ymax
xmin,ymin

13. Tiling the screen Input of coordinates is read from the file dino.dat:
21 Number of polylines
29 Number of vertices in the first polyline
32 435
10 439
4 438
Coordinates of points (world coordinate system)
6 425
…….

14. Tiling the screen
We subdivide the screen into rectangular viewports and then in each viewport draw an image
All images are taken from the same file, different is just the position of viewport
Image 3
Image 4
Image 1
Image 2

15. Window – Viewport transformation
glViewport(left,bottom,right-left,top-bottom);
gluOrtho2D(left,right,bottom,top);
Changing the order of parameters changes the orientation of the image left right top bottom

16. Tiling the screen Picture of dinosaurus is repeated in viewports.
glViewport(i*sW,jv*sH,sW,sH); We specify sW,sH as the width and height of viewports
Changing word window definition to: gluOrtho2D(640,0,480,0); we obtain “upside-down” pictures of dinosaurus

17. Aspect Ratio
Distortion of the image after resizing the window

18. Resizing with the same aspect ratio
W’/R W W’
R=W/H

19. Resizing with the same aspect ratio
H’*R H H’ W W’
R=W/H

20. Resizing the window { if (R > W/H) { screenWidth=W;
Registration of resizing function glutReshapeFunc(myReshape) void myReshape(int W, int H)
{ if (R > W/H)
{ screenWidth=W;
screenHeight=W/R; }
else
{ screenWidth=H*R;
screenHeight=H; } MyDisplay(); }
// R is the aspect ratio of the image window after the resizing has the // same aspect ratio

21. Clipping lines
Not all line segments are completely inside of the world window

22. Clipping lines Testing the position 1100 0100 0110 0000 1000 0010 0011
1001
0001

23. Clipping lines Trivial accept – both end vertices have code (0000)
Trivial reject – both end vertices have “1” in the same region, logical expression (code1 AND code2) is true – nonzero.

24. Clipping lines
Finding intersecting points Dy/ Dx = d/e d= eDy/ Dx ?=Qy-d Dy Q d
(xmin,?) e P Dx

25. Clipping lines
Example: Suppose, that world window is given by instruction
gluOrtho2D(-2.0, 4.0, -1.0, 3.0);
Find the coordinates of the endpoints of the line given by the following code
glBegin( GL_LINES);
glVertex2f(-3.0, 0.0);
glVertex2f(2.0, 5.0);
glEnd( );
glFlush();

26. Relative drawing
lineTo(newPoint)
moveTO(currPoint)

27. Relative drawing void moveTo(GlPoint point){ currPoint = point; }
void lineTo(GlPoint point) {
glBegin(GL_LINES);
glVertex2f(currPoint.x,currPoint.y);
glVertex2f(point.x, point.y); //draw the line
glEnd();
currPoint= point; //update current point to new point
glFlush(); }

28. 2D-Graphical objects
PolyLines- input from -file -interactive (using mouse) -computed (using relative drawing)
Curves -implicit form -parametric form

29. Drawing n-gon
void ngon(int n, float cx, float cy, float radius, float rotAngle) { if(n < 3) return; // bad number of sides double angle = rotAngle * / 180; // initial angle double angleInc = 2 * /n; //angle increment GlPoint newPoint; newPoint.x = radius*cos(angle)+cx; newPoint.y= radius*sin(angle)+cy; moveTo(newPoint); for(int k = 0; k < n; k++) // repeat n times { angle += angleInc; newPoint.x= radius * cos(angle) + cx; newPoint.y= radius * sin(angle) + cy; lineTo(newPoint); }

30. Drawing circle
void drawCircle(GlPoint center, float radius) { const int numVerts = 50; // use larger value for a better circle ngon(numVerts, center.getX(), center.getY(), radius, 0); } Note: another possibility – using Bressenham’s algorithm

31. Drawing Arcs
void drawArc(GlPoint center, float radius, float startAngle, float sweep) { // startAngle and sweep are in degrees const int n = 30; // number of intermediate segments in arc float angle = startAngle * / 180; // initial angle in radians float angleInc = sweep * /(180 * n); // angle increment GlPoint point; point.x=center.x+ radius * cos(angle); point.y=center.y+ radius * sin(angle); moveTo(point); for(int k = 1; k < n; k++, angle += angleInc){ point.y=center.y+ radius * sin(angle); lineTo(point); } }

32. Curves Implicit form F(x,y) = 0
Straight line F(x,y)=(y-A2)(B1 –A1)-(x-A1)(B2 –A2)
Circle F(x,y)= x2 +y2 – R2
Inside – outside function F(x,y) < 0 inside the curve F(x,y) > 0 outside the curve

33. Curves Parametric form – CurrentPoint = (x(t), y(t)) | t  T
Straight line x(t) = A1 +t(B1 –A1) y(t) = A2 +t(B2 –A2)
Ellipse
x(t) = A.cos(t) // A is width of ellipse y(t) = B.sin(t) // B is heigth of ellipse

34. Drawing ellipse
void drawEllipse(GlPoint center,float A,float B) { float cx=center.x; float cy=center.y; GlPoint point; point.x=cx+A; point.y=cy; moveTo(point); for (float t=0.0; t<=TWOPI+0.01; t+=TWOPI/100) point.x=cx+A*cos(t); point.y=cy+B*sin(t); lineTo(point); } glFlush();

35. Other conic sections
Parabola F(x,y)= y2-4ax x(t)=at2 y(t)=2at Hyperbola F(x,y)= (x/a)2- (y/b)2-1 x(t)=a/cos(t) y(t)=b.sin(t)/cos(t)

36. Polar coordinates x(t) = R(t).cos((t)) y(t) = R(t).sin ((t)) y R(t)

37. Other curves Cardioid R(t)=K.(1+cos(t)) Rose R(t)=K.cos(n.t)
Archimedean spiral R(t)=K.t
In all above examples (t)=t