CSCI 4620/8626 Computer Graphics Graphics Output Primitives Last update: 2014-02-03 Coordinate Reference Frames To describe a picture, the world-coordinate reference frame (2D or 3D) must be selected. Each object has geometrical coordinates as well as other attributes (like color). A rectangular region completely enclosing an object is characterized by its coordinate extents. This region is frequently called a bounding box, or in 2D, a bounding rectangle. 2 1
Screen Coordinates Screen coordinates identify pixels on the screen of the display device. The y coordinate identifies a particular scan line, while the x coordinate identifies a particular pixel in the scan line. Hardware typically considered the upper left corner as position (0,0), but this is easily transformed by software. We will assume the coordinates identify the center of a pixel area. 3 Hypothetical Low-level Procedures In the discussion that follows, we ll assume we have two low-level functions that allow us to manipulate individual pixels, given their coordinates. setpixel(x,y) will be used to set the pixel at coordinate (x,y) to the current color setting for the frame buffer. getpixel(x,y,color) will be used to retrieve the color associated with the pixel at coordinate (x,y). For 3D scenes, we d obviously extend the coordinates by adding a depth that is, coordinates would be of the form (x,y,z). 4 2
Absolute and Relative Coordinates The coordinates we ve been using have all been absolute. It would be easy (and useful), however, to specify a current position and then use coordinates that are relative to that current position. For example, if the current position was (5,2), then the relative coordinate (-2,4) would refer to the same pixel as the absolute coordinate (3,6). Relative coordinates are useful if we wish to draw several copies of an object with many geometric components. We describe the object using coordinates relative to some point. Then drawing the object several times with different current positions would yield several identical copies. 5 OpenGL 2D Reference Frames To set up a 2D orthogonal world-coordinate reference frame in OpenGL, we might use the following function calls: glmatrixmode(gl_projection) This specifies which (of several) matrix stacks is to be used to transform the image. We ll discuss the others later. glloadidentity() This sets the current matrix to an identity matrix. gluortho2d(xmin,xmax,ymin,ymax) This call sets up a 2D orthographic viewing region. The parameters specify the left, right, top and bottom clipping planes for the region. Objects and parts of objects outside the region will not be visible; that is, they are clipped. All positions for the OpenGL primitives must be given in absolute coordinates with respect to the reference frame set up by gluortho2d. 6 3
glbegin and glend To draw one or more primitive objects, the function calls that specify the vertices of the object(s) must be preceded by a call to glbegin and followed by a call to glend. glbegin has a single parameter (a symbolic constant) that specifies the type of primitives that will be created from the vertices; there are ten possibilities, including GL_POINTS (draws individual points), GL_LINES (draws line segments defined by pairs of vertices), and others. glend has no parameters. 7 glvertex* ( ) The glvertex functions are used to specify vertices, and are called between calls to glbegin and glend. The asterisk shown after glvertex is not actually written in the code. It is used to indicate that a suffix specifying the number and type of values in the vertex coordinates must be specified. For example, glvertex2i specifies a 2D coordinate from a pair of integers; glvertex2iv indicates that both integer coordinates are specified in the array ( vector ) identified in the argument; and glvertex3f could be used to give a vertex coordinate specified as three float values. 8 4
Line Functions The argument to glbegin can be any of the following to draw line segments: GL_LINES treats each pair of vertices as an individual line segment. Given N vertices, N/2 line segments are drawn. GL_LINE_STRIP draws a connected group of line segments from the first vertex to the last; vertices n and n+1 define line n. N-1 lines are drawn from N vertices. This is frequently called a polyline. GL_LINE_LOOP like GL_LINE_STRIP, but an additional line, from vertex N to vertex 1, is drawn, for a total of N lines. This is also called a closed polyline. 9 Line-Drawing Algorithms A line segment in the real world is continuous, with pigment placed anywhere desired to define the width and path of the line. A graphics output device, however, can only display pixels at a finite number of fixed locations. As a result, lines drawn on graphic displays can appear as jagged stair-steps unless the resolution of the device is high, or unless suitable techniques are used to smooth the jagged edges along the line path. 10 5
Line Equations The slope-intercept equation can be used to define a line: y = m x + b where m is the slope of the line and b is the y intercept. Given the vertices of the endpoints of the line (x end,y end ) and (x 0,y 0 ), we can determine m and b as m = (y end y 0 ) / (x end x 0 ) b = y 0 m x 0 11 Computing Interval Distances Given a change in the x direction x we can compute the corresponding change in the y direction as y = m x. Likewise, given the change y in the y direction we can compute the corresponding change in the x direction as x = y / m. These equations form the basis for determining the deflection voltages in a vector-drawing device. On a raster scan system, however, the positions are constrained to the pixel locations, which define the allowed step size in the x and y directions. 12 6
The DDA Algorithm The DDA, or Digital Differential Analyzer, algorithm is a scan line conversion algorithm based on calculating either x or y using the equations just presented. Assume we re computing y. We find the x values at intervals based on pixel spacing, and then find the corresponding y value. The computed value is then rounded to give the position of the closest pixel. 13 DDA Details Consider first a positive slope (m 0), working from the left endpoint toward the right. With a slope 1, we compute the y position of the next point as y k+1 = y k + m, then round to the nearest pixel y coordinate (with the corresponding x coordinate). With a slope 1, we compute x values using the equation x k+1 = x k + 1/m. If we were drawing the line from the right endpoint toward the left, instead of adding m (or 1/m) in these equations, we would subtract. A similar approach is used with negative slopes. 14 7
DDA Benefits and Drawbacks The DDA algorithm improves on the performance of line drawing based on the point-slope formula by eliminating the multiplication required for each pixel position. Instead, it precomputes the slope(s) and then uses addition (or subtraction). Unfortunately, N additions of a floating point variable x are not always equivalent to the addition of N x, so roundoff errors are possible. In addition, the rounding and floating-point arithmetic in the algorithm are still time-consuming. 15 Bresenham s Algorithm This algorithm uses only integer calculations to calculate pixel positions for straight line segments. It can also be adapted to generating circles and other curves. In the DDA algorithm, we essentially computed the ideal y position of a pixel from the x position using the point-slope formula, and then rounded the ideal position to yield the nearest pixel position. In Bresenham s algorithm, the pixel selection is accomplished by examination of the sign of an integer whose value is proportional to the difference between the vertical separations of the two pixel positions from the actual line path. 16 8
Pixel Positions Relative to Line Pixel d upper Ideal Location d lower Pixel 17 Distances from Line to Pixels The distances from the ideal position to the nearest pixel locations, d upper and d lower, are easily computed: y = m (x k + 1) + b d lower = y y k = m (x k + 1) + b y k d upper = (y k + 1) y = y k + 1 - m (x k + 1) - b 18 9
Difference between Distances Now we can determine the difference between these two distances, and examine its sign: d lower d upper = 2m (x k + 1) 2y k + 2b 1 If we calculate x and y as the separations of the endpoint x and y positions (such that m = x / y), then we can rewrite this as p k = x (dl ower d upper ) = 2 y x k - 2 x y k + c where c is a constant term, 2 y + x (2b 1), which is independent of pixel position. p k is called a decision parameter. 19 Coordinate Changes Once we have the position of one pixel on a line, we know that the next pixel in the line will be one pixel away in either the x or y direction. Therefore successive decision parameters (p k values) use only incremental integer calculations. Making obvious changes, we see that p k+1 = 2 y x k+1-2 x y k+1 + c Subtracting this from the previous equation and noting that x k+1 = x k + 1, we obtain p k+1 = p k + 2 y - 2 x (y k+1 - y k+1 ) and note that y k+1 - y k+1 is either 0 or 1. 20 10
Starting and Continuing Clearly the line segment being drawn will begin at the point (x 0,y 0 ) or alternately at the other end of the segment. m is easily seen to be y / x, and the initial decision parameter p 0 = 2 y x. The constants 2 y and 2 y 2 x (which are the only possible values added to p k to obtain p k+1 ) are computed once for each line to be scan converted, so the arithmetic involves only integer addition and subtraction. 21 Algorithm Summary for m < 1 Get the two line segment endpoints, with the left one being stored in (x 0,y 0 ). Set the color and plot the first point (x 0,y 0 ). Calculate the constants x, y, 2 y and 2 y 2 x, and obtain the starting decision parameter p 0 = 2 y x. At each x k along the line, starting at k=0: if p k < 0, plot (x k +1,y k ) and set p k+1 = p k + 2 y, else plot (x k +1,y k +1) and set p k+1 = p k + 2 y 2 x. Repeat the preceding step 4 x 1 times. 22 11
Parallel Computation With multiple processors, it is possible to perform the calculations required by Bresenham s algorithm in parallel. The basic approach is to divide the line into subintervals, one subinterval for each processor, and then use Bresenham s algorithm in each processor. It is crucial, however, to have each subinterval start at the endpoint of the previous subinterval, so it is necessary to compute the decision parameter for the beginning of each subinterval before the processors begin. Another parallel approach is to assign each processor to a particular group of screen pixels. When drawing a line, each processor computes the distance of its pixels from the line, and then the closest pixels are chosen. 23 Setting Frame Buffer Values If the frame buffer has one bit per pixel, and the pixel positions are addressable in row-major order, we might use (0,0) to label the lower left corner and (x max,y max ) for the top right corner. The frame-buffer bit address for pixel position (x,y) is calculated as addr(x,y) = addr(0,0) + y(x max +1) + x Moving to the next pixel in the same scan line is easy: addr(x+1,y) = addr(x,y) + 1 Moving diagonally to the next scan line is also easy: addr(x+1,y+1) = addr(x,y) + x max + 2 24 12
OpenGL Curve Functions OpenGL does not have intrinsic functions for generating basic curves like circles and ellipses! It does have functions for generating Bezier splines, which can be used to generate approximations to these curves. Also, the OpenGL Utility (GLU) functions provide functions for drawing 3D quadrics, like cones and spheres, and these can be used to draw circles. Another approach is to draw a circle using polylines (as we ve already seen). Still another approach is to adapt the line segment algorithms just seen to dealing with curves. 25 Four, Eight, and Sixteen Sides 26 13
Circle Properties Equations for circle with radius r and center at ( x c, y c ): ( x x c ) 2 + ( y y c ) 2 = r 2 or y = y c r 2 ( x c x ) 2 Simple circle drawing algorithm: Step x in unit increments (pixel size) from xc r to xc + r and compute y, selecting the nearest pixel. Problem: lots of computation, and uneven point density. Alternately, step x and compute y only when the absolute value of the slope is less than 1; otherwise step y and compute x. Problem: even more computation. 27 Example Using Basic Equation 28 14
Alternate Circle Schemes Another equation for a circle uses polar coordinate: x = x c + r cos y = y c + r sin To draw a circle we can select a fixed angular increment and plot equally spaced points along the circumference, and connect these points with lines. The angular step size could also be set to 1/r, which will draw points that are approximately one unit apart. 29 Example Using Polar Coordinates 30 15
Adapting Bresenham s Algorithm Bresenham s algorithm for line segments uses a binary decision parameter to determine the next pixel to select; this parameter is based on the difference between the distance from the ideal point to the two nearest pixels. We can adapt this for circles with a slight modification. We avoid the nonlinearity that would be required by testing the difference in distance of the two possible pixels from the midpoint between the two pixels. 31 Pixel Positions Relative to Midpoint Possible pixel locations y k y k -1 Last pixel location Midpoint location x k x k +1 32 16
The Basic Equation, Rearranged The basic equation for a circle, for use in determining the decision parameter, can be rewritten as: f circ (x, y) = x 2 + y 2 r 2 For an arbitrary point (x, y), the value of this equation is: < 0 if (x, y) is inside the circle s boundary = 0 if (x, y) is on the circle s boundary > 0 if (x, y) is outside the circle s boundary 33 The Decision Parameter For the decision parameter, we want to know if the midpoint between the next two possible pixel locations is inside, outside, or on the circle boundary. Thus we compute: p k = f circ (x k + 1, y k ½) = (x k + 1) 2 + (y k ½) 2 r 2 We then compute p k+1, and find the difference between p k and p k+1, for the two possible pixel locations. 34 17
Decision Parameter Increments Thus we find that the next decision parameter can be determined as either p k+1 = p k + 2x k+1 + 1 (if p k < 0), or p k+1 = p k + 2x k+1 + 1 2y k+1 (if p k 0). If we assume the circle s center is always at (0,0), the initial decision parameter for the point (0,r) is p 0 = 5/4 r. If the radius is specified as an integer, this simplifies to just p 0 = 1 r. 35 Midpoint Algorithm Summary Calculate initial decision parameter p 0 = 1 r. At each x k position, starting with k = 0 If p k < 0, the next point is at (x k+1,y k ) and p k+1 = p k + 2x k+1 + 1 Else the next point is at (x k+1,y k 1 ) and p k+1 = p k + 2x k+1 + 1 2y k+1 Note that 2x k+1 = 2x k + 2 and 2y k+1 = 2y k-2. By symmetry, points in the other seven octants can be determined. Move the calculated points to the proper location by adding x c to x values and y c to y values. Repeat until x y. 36 18
Example Using Midpoint Algorithm 37 Ellipse-Generating Algorithms An ellipse is the set of points P such that the sum of the distance of each point from two other fixed points F 1 and F 2 (called the foci of the ellipse) is constant. Thus is the distance from P to F 1 is d 1, and the distance from P to F 2 is d 2, the general equation of an ellipse is just d 1 + d 2 = constant. The terms major axis and minor axis for an ellipse refer to a line through the foci, and a line perpendicular to the major axis which bisects it; these lines connect points on opposite sides of the ellipse. An ellipse can be said to have two radii, each equal to onehalf the length of the major or minor axes. 38 19
An Ellipse d 1 d 2 Major axis Minor axis F 1 F 2 39 The Ellipse Midpoint Algorithm Although the equations are more complicated than those for a circle, it is still possible to develop decision parameters for drawing an ellipse that involve only integer calculations. We will not discuss this algorithm here, although the details of the algorithm are given in the text. 40 20
Other Curves In general, curves that can be expressed mathematically can be drawn using one of the techniques we have discussed. These include: explicit calculation of y = f(x) using a midpoint algorithm for f(x,y) = 0 approximation using straight line segments, selecting which value (x or y) to increment based on line slope exploiting symmetries in the curves to avoid calculation 41 Spline Curves When a curve does not have a closed mathematical representation (for example, the path an object might take in an animated scene), a few points are selected to describe the general curve contour. Then we might fit a parameterized cubic equation to each set of adjacent points (0 u 1): x = a x0 + a x1 u + a x2 u 2 + a x3 u 3 y = a y0 + a y1 u + a y2 u 2 + a y3 u 3 Inidividual curves are joined to approximate a smooth curve by requiring adjacent curves, where they join, to have the same coordinate position and the same slope. Such continuous curves are called spline curves, or splines. 42 21
Pixel Addressing In our previous discussions, we assume a pixel at (x,y) occupies a unit square with the coordinate (x,y) at the lower left corner and the coordinate (x+1,y+1) at the upper right corner. It is also possible to assume coordinates that address the centers of pixel location. This approach complicates matters somewhat, as we then need to deal with half-integer pixel boundaries and makes many scan-line conversion algorithms more difficult to implement efficiently. 43 Object Geometry Suppose you were asked to cut a one foot section from the end of a board: You d first draw a line perpendicular to the length of the board at one foot from the end of the board. You d then cut the board at the mark you made. But do you cut inside the mark, outside the mark, or on top of the mark? Your answer will affect the length of the section you cut. A similar problem exists in attempting to retain precise object geometry in graphic drawings. If we draw a filled box (bordered by straight lines), pixel positions on the boundary may be outside the box. This problem, due to the fact that pixels have a finite size, is solved by illuminating only those pixels that are interior to the object boundaries. The same approach can be used with other objects. 44 22
Fill-Area Primitives Filled areas are often used in graphics to represent surfaces of solid objects, as well as for other applications. The filled regions are usually planar surfaces, mainly polygons, but other shapes can also be filled (e.g. circles). Graphics libraries do not usually support arbitrary filled shapes, because filling polygons can be done very efficiently (they have linear boundary line equations), and curved surfaces can be approximated with a set of polygonal patches (called surface tessellation, or fitting the surface with a polygon mesh). 45 Polygon Definition A polygon is a plane (2D) figure specified by a set of three or more coordinate positions (vertices) connected in sequence by straight-line segments (edges or sides); the edges have no points in common other than their endpoints. This definition is for an object sometimes called a standard or simple polygon, since some definitions of polygons might not include the restriction on edges having no points except endpoints in common. 46 23
Non-planar Polygons Non-planar polygons can occur in graphics applications. One way to deal with these is to simply divide the polygonal area into triangular areas. A triangle, of course, is always a planar objects. If the division into triangles is not appropriate, then other methods (discussed later) can be used to deal with non-planar polygons. 47 Polygon Classifications An interior angle of a polygon is the angle formed by two adjacent edges. If all interior angles are less than 180, then the polygon is convex. If this is not the case, then the polgon is concave. A degenerate polygon is one that has collinear vertices (two edges that form a straight line), or repeated vertices. Such polygons obviously present problems, but most graphics packages leave the task of avoiding these to the programmer. 48 24
Concave Polygons Filling concave polygons is more complex than filling convex ones. Many graphics packages (including OpenGL) only fill convex polygons; the programmer is responsible for dealing with concave polygons. Some graphics systems may only provide fill capabilities for triangles, greatly simplifying the graphic algorithms. 49 Identifying Concave Polygons If a polygon is concave, then: at least one interior angle is greater than 180 ; extension of some edges will intersect other edges; and a line segment connecting some pair of interior points will intersect one or more polygon edges. Any of these concave polygon characteristics can be used to set up a test. If we set up a vector for each edge, and compute the cross products of adjacent edges, then they should all be positive or all be negative if the polygon is concave. Another approach is to examine vertex positions relative to the extension of each edge. All vertices must be on one side of the line if the polygon is concave. 50 25
Splitting Concave Polygons Since many algorithms and graphics packages only deal with convex polygons, concave polygons (once identified) must be split into a set of convex polygons. Assuming the initial concave polygon is flat (that is, all vertices lie in the same plane), we can use either of two methods as the basis for a splitting algorithm: the vector method or the edge extension line method. 51 The Vertex Method (Identification) Assume each edge of a concave polygon is a vector defined as E k = V k+1 V k Next calculate the cross products of successive edge vectors in order around the polygon perimeter. Assume vertices (and vectors) are numbered in a counterclockwise order, and assume the vertices are all in the XY plane (for convenience). Then if any cross product E k E k+1 has a negative Z component, the polygon is concave. Otherwise, it is convex. 52 26
Cross Product Calculation a b n a b a b = a b sin( ) n a, b = magnitude of vectors a and b is the angle between a and b n is the unit vector at right angles to both a and b (imagine turning a screw from a into b to see the direction of n). 53 The Vertex Method (Splitting) If the polygon is concave, then identify each cross product (say E i E i+1 ) with a negative Z component. Determine the intersection of the extension of each E i vector with the other vectors to split the polygon into two pieces. Note that if the extension of the E i vector intersects multiple edges, we only consider the first (counterclockwise) edge it intersects. 54 27
Example of The Vertex Method E 5 E 4 E 3 E 2 Since E 2 E 3 has a negative Z component, E 2 is extended to its intersection with E 5 to form two polygons. E 1 55 The Rotation Method An alternate approach is to sequentially translate each vertex V k of the polygon to the origin, and then rotate the polygon so the edge from the translated vertex V k is on ( in ) the x axis. Thus V k+1 will also have an y-component of 0. If the next vertex (V k+2 ) has a negative y- component, then the polygon is concave, and we split it along the x axis to form two new polygons. 56 28
Splitting a Polygon into Triangles Many graphics algorithms can be greatly simplified by dealing only with triangular regions, so splitting a (convex) polygon into triangles is useful. This is easily accomplished: Pick V 1 as the common starting point. Form a triangle from V 1, V 2 and V 3. Form a triangle from V 1, V 3 and V 4. Form the last triangle from V 1, V n-1 and V n. 57 Example of Triangle Formation V 5 V 4 V 3 V 2 V 1 58 29
Inside-Outside Tests Filling objects requires determining whether a pixel location is inside or outside the object. For some objects, like rectangles or circles, this test is relatively simple. For more complex objects (for example, rectangle with an intersecting circle), determining whether a pixel is inside or outside the region to be filled is more complex. Several tests can be used to make this determination. 59 The Even-Odd Rule This rule classifies a point based on the number of times a line drawn from outside the figure to the point crosses a boundary line of the figure. If the line crosses an even number of boundary lines, then the point is outside (exterior to) the figure. Otherwise (the line crosses an odd number of boundary lines) the point is inside (interior to) the figure. 60 30
Even-Odd Rule Example odd odd odd even odd even 61 The Non-Zero Winding Number Rule Another test counts the number of times the boundary of the object winds around a point being considered. We again count line crossings from a point outside the figure to the point being considered. In this case, however, we treat the boundary lines as vectors, and compute the difference between the number of left-right crossings and the number of right-left crossings. A zero crossing count identifies a point as exterior, while a non-zero count identifies a point as interior. 62 31
Non-Zero Winding Number Example Interior Interior Exterior Exterior 63 Caveats Lines from the exterior to the point being evaluated must not cross through vertices, since a vertex is an ambiguous point on a line that is, it is uncertain whether a line has been crossed zero, one, or two times when we pass through a vertex. The non-zero winding number rule tends to classify some points as interior that the even-odd rule would count as exterior. This makes it more appropriate in some cases (e.g. characters and nested polygons). For curved lines, the non-zero winding number rule uses a vector tangent to the curve at the crossing point. 64 32
Representing the Polygons Each data structure used to representing polygons can be classified as providing either geometric data or attribute data. Geometric data is conveniently organized as three structures: a vertex table that just lists vertices an edge table that identifies the vertices (in order) for each edge a surface-facet table that identifies the edges (in order) for each surface 65 Extending the Tables Additional information can be added to the tables as appropriate to an application or algorithm. Some of the information that might be added includes slope for edges bounding box information links between surface-facet entries to identify common edges links between vertices and the edges of which they are components 66 33
Validating the Data It is important for the data in the various tables to be correct. Tests that might be performed to validate the data include verifying that each vertex is part of at least two edges each edge is part of at least one polygon each polygon is closed each polygon has at least one shared edge links between edges and polygons are matched by links from polygons back to component edges (if links are used) 67 Plane Equations A plane is defined by three noncollinear points, say P 1 = (x 1,y 1,z 1 ), P 2, and P 3. The equation of a plane Ax + By + Cz + D = 0 holds for each point (x,y,z) in the plane. This equation can be rewritten as (A/D)x + (B/D)y + (C/D)z = 1. Given the three points, the three coefficients in this equation can be determined using simple linear algebra (that is, three linear equations with three unknowns). The coefficients for this equation can be stored as a component of the polygon facet table. 68 34
Multiple Planes To deal with polygons that are not planar, we may treat each polygon as a set of triangles (each of which, by definition, is planar) find an approximating plane for the polygon vertices by computing the average parameters from those for each set of three polygon vertices project each vertex onto the coordinate planes, and use plane parameters that are proportional to the area of each plan so projected. 69 Front and Back Polygon Faces Polygons are often used as components of object surfaces. Since these objects usually have an interior and an exterior, the component polygons also have interior and exterior faces. The side of a polygon that faces an object s interior is the back face; the other side (facing the exterior) is the front face. This is easy to remember if you consider the rectangles used to construct a box. 70 35
Identifying Front and Back Faces If we assume a planar polygon, and the parameters (A, B, C and D) for the equation of the plane containing the polygon were computed using counterclockwise ordering of the vertices (viewing from front to back), then we can identify the position of any point (x,y,z) relative to the polygon s plane by evaluating Ax + By +Cz + D. If positive, the point (x,y,z) is in front of the plane. Otherwise (if negative), the point is behind the plane. Another approach is to compute a unit normal vector to the plane pointing from inside the plane to outside. This vector can be computed from the plane parameters, or from the cross product of any two vectors in the plane (like edges). 71 36