Upcoming SlideShare
×

# CG OpenGL line & area-course 3

1,333 views

Published on

Computer Graphs about line & area designs (OpenGL)

Published in: Design, Technology, Education
0 Likes
Statistics
Notes
• Full Name
Comment goes here.

Are you sure you want to Yes No
• Be the first to comment

• Be the first to like this

Views
Total views
1,333
On SlideShare
0
From Embeds
0
Number of Embeds
104
Actions
Shares
0
40
0
Likes
0
Embeds 0
No embeds

No notes for slide

### CG OpenGL line & area-course 3

1. 1. Line & Area Chen Jing-Fung (2006/10/24) Assistant Research Fellow, Digital Media Center,National Taiwan Normal University Video Processing Lab 臺灣師範大學數位媒體中心視訊處理研究室 National Taiwan Normal University
2. 2. Coordinate representations Viewing & Projection Coordinates 1 1 Modeling 1 Video Monitor(local or master) Coordinates Plotter World Normalized (Cartesian) Coordinates Coordinates Other Output Device Coordinates Video Processing Lab 2 臺灣師範大學數位媒體中心視訊處理研究室
3. 3. Reshape function Video Processing Lab 3 臺灣師範大學數位媒體中心視訊處理研究室
4. 4. Monitor monitor Video Processing Lab 4http://groups.csail.mit.edu/graphics/classes/6.837/F04/calendar.html 臺灣師範大學數位媒體中心視訊處理研究室
5. 5. 2D graph• Plot figure in 2D coordinate – X-coordinate indicated horizontal – Y-coordinate indicated vertical – Z-coordinate indicated depth simple nonsimple Video Processing Lab 5 臺灣師範大學數位媒體中心視訊處理研究室
6. 6. Coordinate Reference• A set of coordinate extents y – Bounding box (3D), bounding rectangle (2D) 5 – Max & Min (x, y, z), (x, y) 4• Screen coordinates 3 2 – Scan line number: y 1 – Column number: x 0 x 01 2345• A low-level procedure of the pixel position – setPixel(x, y);• Retrieve the current frame-buffer setting for a pixel location – getPixel(x, y, color); Combine RGB bit codes Video Processing Lab 6 臺灣師範大學數位媒體中心視訊處理研究室
7. 7. Coordinate specifications• Absolute coordinate & Relative coordinate – Last position (current position): (3, 8) – => Some graph packages is used relative coordinate: (2, -1) -> Absolute position: (5, 7) Video Processing Lab 7 臺灣師範大學數位媒體中心視訊處理研究室
8. 8. 2D world-coordinate in OpenGL• An orthogonal projection function – gluOrtho2D glMatrixMode (GL_PROJECTION); glLoadIdentity (); Assign the identity matrix gluOrtho2D (xmin, xmax, ymin, ymax); World coordinate range ymax Display window ymin xmin xmax Video Processing Lab 8 臺灣師範大學數位媒體中心視訊處理研究室
9. 9. How to a parameter drawing line? Video Processing Lab 臺灣師範大學數位媒體中心視訊處理研究室 National Taiwan Normal University
10. 10. Bresenham’s line algorithm• Bresenham’s line is an accurate and efficient raster line-generating algorithm• Use only incremental integer calculations.• Determine at next sample point whether to plot. – The positive-slope line: if start point (50, 50), next point? • (51, 50) or (51, 51) Video Processing Lab 10 臺灣師範大學數位媒體中心視訊處理研究室
11. 11. Parallel Bresenham line algorithm • Drawing parallel processing – Two different line on the same plane and along a line path simultaneously. yk+1 yk xk+1 11 P. 99-101 Video Processing Lab 臺灣師範大學數位媒體中心視訊處理研究室
12. 12. How to buffer value by the structure? Video Processing Lab 臺灣師範大學數位媒體中心視訊處理研究室 National Taiwan Normal University
13. 13. Setting frame-buffer values • Since scan-conversion algorithms generate pixel positions which are labeled from (0, 0) to (xmax, ymax), the frame-buffer bit address is calculated as – (x, y) Screen • addr(x, y) = addr(0, 0) + y(xmax + 1)+x yend – (x+1, y) • addr(x+1, y) = addr(x, y) + 1 (x, y) – (x+1, y+1) y0 • addr(x+1, y+1) = addr(x, y) + xmax + 2 x0 xend Frame buffer: (0, 0) (1, 0) (2, 0) (0, 1) (x, y) (xmax, 0) (xmax, ymax) addr(0, 0) addr(x, y) Video Processing Lab 13 臺灣師範大學數位媒體中心視訊處理研究室
14. 14. Another drawing line method Use Midpoint Video Processing Lab 臺灣師範大學數位媒體中心視訊處理研究室 National Taiwan Normal University
15. 15. Circle-generating algorithms • A circle is defined as the set of points – Radius = r, center position (xc, yc) (x-xc)2+(y-yc)2=r2 – X axis in unit steps from xc- r to xc+ r and calculating the corresponding y values at each position as y  y c  r 2  ( xc  x )2 – using polar coordinates r and θ Video Processing Lab 15 p.103-104 臺灣師範大學數位媒體中心視訊處理研究室
16. 16. Symmetry of a circle• Eight octants – Calculation if a circle point (x, y) in one octant yields the circle points shown for the other seven octants• More efficient circle algorithm are based on incremental calculation of decision parameters, which involves only simple integer operations. (as in the Bresenham line algorithm) Video Processing Lab 16 臺灣師範大學數位媒體中心視訊處理研究室
17. 17. Midpoint circle algorithm (1)• The basic idea is to test the halfway position between two pixels – Determine inside or outside the circle boundary.• Midpoint method = Bresenham line algorithm – Integer circle radius – A straight-line segment Video Processing Lab 17 臺灣師範大學數位媒體中心視訊處理研究室
18. 18. Midpoint circle algorithm (2) • To apply the midpoint method, we define a circle function as: – fcirc(x, y) = x2+y2-r2 x 2 + y2 - r 2 = 0 yk <0, if (x,y) is inside the circle boundary yk-1 Midpointfcirc(x,y) =0, if (x,y) is on the circle boundary yk-2 >0, if (x,y) is outside the circle boundary xk xk+1 xk+2 – Decision parameter (each xk, k=0 & pk<0) • pk= fcirc(xk+1, yk-1/2) • pk+1=pk+2(xk+1) + (yk+12-yk2) - (yk+1-yk)+1 – Increment? What is different between midpoint and line- based? Video Processing Lab 18 p.105-109 臺灣師範大學數位媒體中心視訊處理研究室
19. 19. Other curves• Various curve functions are useful in object modeling, animation path specification and other graphics applications.• Commonly encountered curves include conics, general polynomials and spline functions. – Conic sections: Ax2+ By2+Cxy+Dx+Ey+F=0 v0 g – Parabolic y0 • trajectory: y=y0+a(x-x0)2+b(x-x0) • Projection point: x=x0+vx0t; y=y0+vy0t-1/2gt2 – Hyperbola: (x/rx)2-(y/ry)2=1 x0 Spline curve formed with individual ry cubic polynomial sections between specified coordinate positions rx Video Processing Lab 19 臺灣師範大學數位媒體中心視訊處理研究室
20. 20. Fill-Area Video Processing Lab 臺灣師範大學數位媒體中心視訊處理研究室 National Taiwan Normal University
21. 21. Fill-Area Primitives• Polygon area (solid-color, patterned) – scan-line to fill polygon • Intersection points located and sorted • Consecutive pairs define interior span • Attention with vertex intersections • Exploit coherence (incremental calculations) – flood fill algorithm Video Processing Lab 21 臺灣師範大學數位媒體中心視訊處理研究室
22. 22. Fill-area primitives• Describing components of a picture is an area that is filled with some solid color – Polygon is a plane figure specified by • Vertices: three or more coordinate positions • Edges or sides: straight-line segments concave convey <1800 >1800 • Area…. Video Processing Lab 22 臺灣師範大學數位媒體中心視訊處理研究室
23. 23. Concave polygons• The direction of surface is “z’’ axle• Given two consecutive vertex (V) positions, Vk and Vk+1, we define the edge vector (E) as Ek = Vk+1 - Vk (Cross product) y V6 V5 (E1 x E2)z > 0 E4 (E2 x E3)z > 0 V4 Where is “z” (E3 x E4)z < 0 convex E3 E2 V3 V1 V2 E1 x concave Test!! Video Processing Lab 23 臺灣師範大學數位媒體中心視訊處理研究室
24. 24. Splitting concave polygons• Vector method – All vector cross products have the same sign => convex• Rotational method – rotate polygon-edges onto x-axis, always same direction => convex – Each vertex vk Area 1 V1 • Origin: translate Vk V3 V2 • Rotate clockwise Vk+1 on x-axis • If vertex below x-axis => split Area 2 V4 Video Processing Lab 24 臺灣師範大學數位媒體中心視訊處理研究室
25. 25. Inside-Outside Tests• Testing interior vs. exterior object boundaries – Odd-even (parity) rule or nonzero winding parity rule• Odd-even rule – number of segments crossed by the line drawn from P to distant point outside the coordinate extents • bounding rectangle or box is odd it is interior point • else it is exterior point – use the rule for color filling of rings, 2 concentric polygons Video Processing Lab 25 臺灣師範大學數位媒體中心視訊處理研究室
26. 26. Nonzero winding parity rule• Nonzero winding parity rule may yield different interior and exterior regions – Setup vectors along object edges and the reference line. – Compute cross product of vector u along the line from P to a distant point, with object vector E for each edge that crosses the line. – With 2 D object in XY plane direction of cross product will be + z direction or –z direction. • if z component for a crossing is +ve that segment crosses from left to right, add 1 to winding number • else if it is left to right subtract 1 from winding number simpler Video Processing Lab 26 臺灣師範大學數位媒體中心視訊處理研究室
27. 27. 3D inside-outside • Consider a sphere, x2 + y2 + z2 = 1. – Interior: the set of all points that satisfy x2 + y2 + z2 < 1 – The solids surface: x2 + y2 + z2 <= 1. – Exterior: x2 + y2 + z2 > 1. Interior point A boundary Boundary point C Exterior point B Video Processing Lab 27http://www.cs.mtu.edu/~shene/COURSES/cs3621/NOTES/model/closure.html 臺灣師範大學數位媒體中心視訊處理研究室
28. 28. Polygon Surfaces (1)• Set of surface polygons enclose object interior = Boundary Representation (“B-rep”) wireframe representation of a cylinder with back (hidden) lines removed Video Processing Lab 28 臺灣師範大學數位媒體中心視訊處理研究室
29. 29. Polygon Surfaces (2)• Polygon tables (B-rep lists) – Geometric and attribute tables – Vertex, edge, polygon tables – Consistency, completeness checks Video Processing Lab 29 臺灣師範大學數位媒體中心視訊處理研究室
30. 30. Two polygon surfaces • Geometric data-table representation for two adjacent polygon surface facets, formed with six edges and five vertices VERTEX TABLE EDGE TABLE V1 E1: V1, V2 V1: x1, y1, z1 E2: V2, V3 V2: x2, y2, z2 E1 E3 E6 E3 V3 S1 E4 V4 S2 V5 E5 V5 E2 V E6 3 E 4 E5 SURFACE-FACET TABLEV2 S1: E1, E2,E3 V4 S2: E3, E4, E5, E6 Video Processing Lab 30 臺灣師範大學數位媒體中心視訊處理研究室
31. 31. Video Processing Lab 31http://www.icg.tu-graz.ac.at/courses/bacgvis/slides 臺灣師範大學數位媒體中心視訊處理研究室
32. 32. Plane equations • Ax+By+Cz+D=0 – Plane parameter: A, B, C and D • Normal vector (N) the plane equation: x − 1 = 0.The normal vector:N=( A, B, C )Plane equationAx + By + Cz + D = 0 Video Processing Lab 32 臺灣師範大學數位媒體中心視訊處理研究室
33. 33. 3D cartesian coordinate y axis y axis z axis x axis x axis z axis Left-handed cartesian Right-handed cartesian Video Processing Lab 33 臺灣師範大學數位媒體中心視訊處理研究室
34. 34. Front and Back Polygon Faces (1)• Back face = polygon side that faces into the object interior• Front face = polygon side that faces outward• Behind a polygon plane = visible to the polygon back face• In front of a polygon plane = visible to the polygon front face Video Processing Lab 34 臺灣師範大學數位媒體中心視訊處理研究室
35. 35. Front and Back Polygon Faces (2)• Ax + By + Cz + D = 0 for points on the surface < 0 for points behind > 0 for points in front – right-handed coordinate system – polygon points in counterclockwise order• V1, V2, V3 counterclockwise => normal vector N = (V2 - V1) x (V3 - V1) Video Processing Lab 35 臺灣師範大學數位媒體中心視訊處理研究室
36. 36. What is Cross product (x) ? • A mathematical joke asks, – "What do you get when you cross a mountain-climber with a mosquito? " • On the television sitcom, Head of the Class asks, – "What do you get when you cross an elephant and a grape?" Video Processing Lab 36 http://mathworld.wolfram.com/CrossProduct.html 臺灣師範大學數位媒體中心視訊處理研究室
37. 37. Cross product (x)• The orientation determined by the right-hand rule Video Processing Lab 37 http://mathworld.wolfram.com/CrossProduct.html 臺灣師範大學數位媒體中心視訊處理研究室
38. 38. OpenGL polygon fill-area functions• OpenGL provides a special rectangle function – glRect*(x1, y1, x2, y2); • *: i (integer), s (short), f (float), d (double) and v (vector) • plRectiv(vertex1, vertex2);• Fill rectangle use “glVertex” • glBegin (GL_POLYGON); – glVertex2iv (p1); – glVertex2iv (p2); p6 p5 – glVertex2iv (p3); – glVertex2iv (p4); – glVertex2iv (p5); p1 p4 – glVertex2iv (p6); • glEnd (); p2 p3 Video Processing Lab 38 臺灣師範大學數位媒體中心視訊處理研究室
39. 39. How to design “font”?A complete set of type of one size and face. Video Processing Lab 臺灣師範大學數位媒體中心視訊處理研究室 National Taiwan Normal University
40. 40. South China Morning Post, 13 Sep., 2005Video Processing Lab 40 臺灣師範大學數位媒體中心視訊處理研究室
41. 41. Texture• Graphics displays often include textural information : – labels on graphs and charts – signs on buildings or vehicles – General identifying information for simulation and visualization applications. Video Processing Lab 41 臺灣師範大學數位媒體中心視訊處理研究室
42. 42. Typeface (1)• Letters, numbers and other characters can be displayed in a variety of sizes and styles. – The overall design style for a set of characters – Routines for generating character primitives • 20-point Courier Italic or 28-point Palatino Bold • font : – 14 points, a total character height is about 0.5 cm. A – 72 points is about 2.54 cm (1 inch) B Video Processing Lab 42 臺灣師範大學數位媒體中心視訊處理研究室
43. 43. Typeface (2)the letter B represented with an 8x8 bilevelbitmap pattern and with an outline shapedefined with straight line and curvesegments Video Processing Lab 43 臺灣師範大學數位媒體中心視訊處理研究室
44. 44. Homework (1)• Select 6 points and try to draw primitive constant – (a) GL_POLYGON (b) GL_TRIANGLES (c) GL_TRIANGLE_STRIP (d) GL_TRIANGLE_FAN• Select 8 points and try to draw primitive constant – (a) GL_QUADS (b) GL_QUAD_STRIP• Draw 50 100 100 200 Video Processing Lab 44 臺灣師範大學數位媒體中心視訊處理研究室
45. 45. Homework (2)• Draw switch – (1) parabolic • x = y2 (-10≦y ≦10) – (2) 2D curve path • 2D : Set (x0, y0) & step (relate to θ), m:integer – r=sin (mθ) r=A+Bcos(mθ) r=e-mθ r=mθ Video Processing Lab 45 臺灣師範大學數位媒體中心視訊處理研究室
46. 46. Reference• http://www.icg.tu- graz.ac.at/courses/bacgvis/slides• South China Morning Post, 13 Sep., 2005• Computer Graphics with OpenGL 3/e, Hearn Baker, Third edition, ISBN： 0131202383 Video Processing Lab 46 臺灣師範大學數位媒體中心視訊處理研究室