Main Reference

• Computer Graphics with Open GL, 4th edition, Hearn, Baker & Carithers.

2
 Chapter Three
Graphics Output Primitives

3
 Content

1. Coordinate Reference Frames

2. Specifying a Two-Dimensional World-Coordinate
Reference Frame in OpenGL
3. OpenGL Point Functions
4. OpenGL Line Functions
5. OpenGL Curve Functions
6. Fill-Area Primitives
7. Polygon Fill Areas
8. OpenGL Polygon Fill-Area Functions

4
 Definitions

• One of the first things when creating a computer

generated picture is to describe various picture
components of a virtual scene.
▪To provide the shape or structure of the individual
objects
▪To provide their coordinate locations in the scene
• Graphics output primitive: functions in the CG API
describe such picture components
• Geometric primitives: define the geometry of objects
▪ Lines, Triangles, Quadrics, Conic sections, Curved
surfaces, ……
5
 Coordinate Reference Frames

• The coordinate positions are stored in the scene description

along with other information about the objects, such as their
color and their coordinate extents.

• Coordinate extents are the minimum and maximum x, y, and z

values for each object.

• A set of coordinate extents is also described as a bounding

box for an object.

• For a two-dimensional figure, the coordinate extents are

sometimes called an object’s bounding rectangle.
6
 Screen Coordinates

• Locations on a video monitor are referenced in

integer screen coordinates, which correspond to the
pixel positions in the frame buffer.

7
Screen Coordinates

8
 Screen Coordinates

• We will assume that we have available a low-level

procedure of the form
setPixel (x, y);

• This procedure stores the current color setting into the

frame buffer at integer position (x, y), relative to the
selected position of the screen-coordinate origin.

9
 Screen Coordinates

• We sometimes also will want to be able to retrieve the

current frame-buffer setting for a pixel location.
• So we will assume that we have the following low-level
function for obtaining a frame-buffer color value:
getPixel (x, y, color);
• In this function, parameter color receives an integer
value corresponding to the combined red, green, and
blue (RGB) bit codes stored for the specified pixel at
position (x, y).
10
 Specifying A Two-Dimensional World-Coordinate Reference Frame in OpenGL

• The gluOrtho2D command is a function we can use to

set up any two-dimensional Cartesian reference
frame.
• Since the gluOrtho2D function specifies an orthogonal
projection, we need also to be sure that the
coordinate values are placed in the OpenGL
projection matrix.
• In addition, we could assign the identity matrix as the
projection matrix before defining the world-
coordinate range.
11
 Specifying A Two-Dimensional World-Coordinate Reference Frame in OpenGL

• For the two-dimensional examples, we can define the

coordinate frame for the screen display window with the
following statements:
glMatrixMode (GL_PROJECTION);
glLoadIdentity ( );
gluOrtho2D (xmin, xmax, ymin, ymax);

• The display window will then be referenced by coordinates

(xmin, ymin) at the lower-left corner and by coordinates
(xmax, ymax) at the upper-right corner, as shown in Figure 2.
12
Specifying A Two-Dimensional World-Coordinate Reference Frame in OpenGL

13
 OpenGl Point Functions

• We use the following OpenGL function to state the

coordinate values for a single position:
glVertex* ( );

• Where the asterisk (*) indicates that suffix codes are required
for this function.

• These suffix codes are used to identify the spatial dimension,

the numerical data type to be used for the coordinate
values, and a possible vector form for the coordinate
specification.
14
 OpenGl Point Functions

• Calls to glVertex functions must be placed between a glBegin function

and a glEnd function.

• The argument of the glBegin function is used to identify the kind of output
primitive that is to be displayed, and glEnd takes no arguments.

• For point plotting, the argument of the glBegin function is the symbolic
constant GL POINTS.

• Thus, the form for an OpenGL specification of a point position is

glBegin (GL_POINTS);
glVertex* ( );
glEnd ( );
15
 OpenGl Point Functions
• Coordinate positions in OpenGL can be given in two, three, or
four dimensions.

• We use a suffix value of 2, 3, or 4 on the glVertex function to

indicate the dimensionality of a coordinate position.

• A four-dimensional specification indicates a homogeneous-

coordinate representation, where the homogeneous parameter
h (the fourth coordinate) is a scaling factor for the Cartesian-
coordinate values.

• Homogeneous-coordinate representations are useful for

expressing transformation operations in Matrix form.
16
 OpenGl Point Functions

• Because OpenGL treats two-dimensions as a special case of three

dimensions, any (x, y) coordinate specification is equivalent to a
three-dimensional specification of (x, y, 0).

• We also need to state which data type is to be used for the

numerical value specifications of the coordinates.

• This is accomplished with a second suffix code on the glVertex

function.

• Suffix codes for specifying a numerical data type are i (integer), s

(short), f (float), and d (double).
17
 OpenGl Point Functions

• Finally, the coordinate values can be listed explicitly in the glVertex

function, or a single argument can be used that references a
coordinate position as an array.

• If we use an array specification for a coordinate position, we need

to append v (for “vector”) as a third suffix code.

18
OpenGl Point Functions

19
 OpenGl Point Functions

• In the following example, three equally spaced points

are plotted along a two dimensional, straight-line
path, (see Figure 3). Coordinates are given as integer
pairs:
glBegin (GL_POINTS);
glVertex2i (50, 100);
glVertex2i (75, 150);
glVertex2i (100, 200);
glEnd ( );
20
 OpenGl Point Functions

• Alternatively, we could specify the coordinate values

for the preceding points in arrays such as
int point1 [ ] = {50, 100};
int point2 [ ] = {75, 150};
int point3 [ ] = {100, 200};
• and call the OpenGL functions for plotting the three
points as
glBegin (GL_POINTS);
glVertex2iv (point1);
glVertex2iv (point2);
glVertex2iv (point3);
glEnd ( );
21
 OpenGl Line Functions
• Graphics packages typically provide a function for specifying one
or more straight-line segments, where each line segment is defined
by two endpoint coordinate positions.

• For example, if we have five coordinate positions, labeled p1

through p5, and each is represented as a two-dimensional array,
then the following code could generate the display shown in
Figure 4(a):
glBegin (GL_LINES);
glVertex2iv (p1);
glVertex2iv (p2);
glVertex2iv (p3);
glVertex2iv (p4);
glVertex2iv (p5);
glEnd ( );
22
OpenGl Line Functions

23
 OpenGl Line Functions

• With the OpenGL primitive constant GL_LINE_STRIP,we obtain

a polyline.
• Using the same five coordinate positions as in the previous
example, we obtain the display in Figure 4(b) with the
code
glBegin (GL_LINE_STRIP);
glVertex2iv (p1);
glVertex2iv (p2);
glVertex2iv (p3);
glVertex2iv (p4);
glVertex2iv (p5);
glEnd ( );
24
 OpenGl Line Functions

• The third OpenGL line primitive is GL_LINE_LOOP, which produces a

closed polyline.

• Figure 4(c) shows the display of our endpoint list when we select this line
option, using the code
glBegin (GL_LINE_LOOP);
glVertex2iv (p1);
glVertex2iv (p2);
glVertex2iv (p3);
glVertex2iv (p4);
glVertex2iv (p5);
glEnd ( );

25
 OpenGl Curve Functions

• Routines for generating basic curves, such as circles and

ellipses, are not included as primitive functions in the
OpenGL core library.
• But this library does contain functions for displaying B´ezier
splines, which are polynomials that are defined with a
discrete point set.
• And the OpenGL Utility (GLU) library has routines for three-
dimensional quadrics, such as spheres and cylinders, as
well as routines for producing rational B-splines, which are
a general class of splines that include the simpler B´ezier
curves.
26
 OpenGl Curve Functions

• Using rational B-splines, we can display circles, ellipses, and

other two-dimensional quadrics.

• In addition, there are routines in the OpenGL Utility Toolkit

(GLUT) that we can use to display some three-dimensional
quadrics, such as spheres and cones, and some other shapes.

• However, all these routines are more involved than the basic
primitives we introduce in this chapter.

27
OpenGl Curve Functions

28
 Fill-Area Primitives

• Another useful construct, besides points, straight-line

segments, and curves, for describing components of a
picture is an area that is filled with some solid color or
pattern.

• A picture component of this type is typically

referred to as a fill area or a filled area.

29
Fill-Area Primitives

30
Fill-Area Primitives

31
 Fill-Area Primitives

• Objects described with a set of polygon surface

patches are usually referred to as standard
graphics objects, or just graphics objects.

32
 Polygon Fill Areas

• Mathematically defined, a polygon is a plane

figure specified by a set of three or more
coordinate positions, called vertices, that are
connected in sequence by straight-line segments,
called the edges or sides of the polygon.

• Examples of polygons include triangles, rectangles,

octagons, and decagons.
33
 Polygon Fill Areas

• Sometimes, any plane figure with a closed-polyline boundary

is alluded to as a polygon, and one with no crossing edges is
referred to as a standard polygon or a simple polygon.

• In an effort to avoid ambiguous object references, we will use

the term polygon to refer only to those planar shapes that
have a closed-polyline boundary and no edge crossings.

34
 OpenGL Polygon Fill-Area Functions

• With one exception, the OpenGL procedures for specifying fill

polygons are similar to those for describing a point or a
polyline.

• A glVertex function is used to input the coordinates for a

single polygon vertex, and a complete polygon is described
with a list of vertices placed between a glBegin/glEnd pair.

• However, there is one additional function that we can use for

displaying a rectangle that has an entirely different format.

35
 OpenGL Polygon Fill-Area Functions

• By default, a polygon interior is displayed in a solid color, determined by

the current color settings.

• As options, we can fill a polygon with a pattern and we can display

polygon edges as line borders around the interior fill.

• There are six different symbolic constants that we can use as the
argument in the glBegin function to describe polygon fill areas.

• These six primitive constants allow us to display a single fill polygon, a set
of unconnected fill polygons, or a set of connected fill polygons.

36
 OpenGL Polygon Fill-Area Functions

• In OpenGL, a fill area must be specified as a convex

polygon.

• Thus, a vertex list for a fill polygon must contain at least

three vertices, there can be no crossing edges, and all
interior angles for the polygon must be less than 180◦.

37
 OpenGL Polygon Fill-Area Functions

• Because graphics displays often include rectangular fill areas, OpenGL

provides a special rectangle function that directly accepts vertex
specifications in the xy plane.
• In some implementations of OpenGL, the following routine can be more
efficient than generating a fill rectangle using glVertex specifications:
glRect* (x1, y1, x2, y2);
• One corner of this rectangle is at coordinate position (x1, y1), and the
opposite corner of the rectangle is at position (x2, y2).

• Suffix codes for glRect specify the coordinate data type and whether
coordinates are to be expressed as array elements.
• These codes are i (for integer), s (for short), f (for float), d (for double),
and v (for vector). The rectangle is displayed with edges parallel to the
xy coordinate axes.
38
 OpenGL Polygon Fill-Area Functions

• As an example, the following statement defines the square

shown in Figure 21:
glRecti (200, 100, 50, 250);

• If we put the coordinate values for this rectangle into arrays,

we can generate the same square with the following code:
int vertex1 [ ] = {200, 100};
int vertex2 [ ] = {50, 250};
glRectiv (vertex1, vertex2);

39
OpenGL Polygon Fill-Area Functions

40
 OpenGL Polygon Fill-Area Functions

• Each of the other six OpenGL polygon fill primitives is

specified with a symbolic constant in the glBegin
function, along with a a list of glVertex commands.

• With the OpenGL primitive constant GL_POLYGON, we

can display a single polygon fill area such as that
shown in Figure 22(a).

41
OpenGL Polygon Fill-Area Functions

42
 OpenGL Polygon Fill-Area Functions
• For this example, we assume that we have a list of six points,
labeled p1 through p6, specifying two-dimensional polygon
vertex positions in a counterclockwise ordering.
• Each of the points is represented as an array of (x, y)
coordinate values:
glBegin (GL_POLYGON);
glVertex2iv (p1);
glVertex2iv (p2);
glVertex2iv (p3);
glVertex2iv (p4);
glVertex2iv (p5);
glVertex2iv (p6);
glEnd ( );
43
 OpenGL Polygon Fill-Area Functions

• If we reorder the vertex list and change the

primitive constant in the previous code example to
GL_TRIANGLES, we obtain the two separated
triangle fill areas in Figure 22(b):
glBegin (GL_TRIANGLES);
glVertex2iv (p1);
glVertex2iv (p2);
glVertex2iv (p6);
glVertex2iv (p3);
glVertex2iv (p4);
glVertex2iv (p5);
glEnd ( );
44
 OpenGL Polygon Fill-Area Functions

• By reordering the vertex list once more and changing

the primitive constant to GL_TRIANGLE_STRIP, we can
display the set of connected triangles shown in Figure
22(c):
glBegin (GL_TRIANGLE_STRIP);
glVertex2iv (p1);
glVertex2iv (p2);
glVertex2iv (p6);
glVertex2iv (p3);
glVertex2iv (p5);
glVertex2iv (p4);
glEnd ( );
45
 OpenGL Polygon Fill-Area Functions

• Another way to generate a set of connected triangles is to

use the “fan” approach illustrated in Figure 22(d), where all
triangles share a common vertex.
• We obtain this arrangement of triangles using the primitive
constant GL_TRIANGLE_FAN and the original ordering of our
six vertices:
glBegin (GL_TRIANGLE_FAN);
glVertex2iv (p1);
glVertex2iv (p2);
glVertex2iv (p3);
glVertex2iv (p4);
glVertex2iv (p5);
glVertex2iv (p6);
glEnd ( );
46
 OpenGL Polygon Fill-Area Functions

• Besides the primitive functions for triangles and a

general polygon, OpenGL provides for the
specifications of two types of quadrilaterals (four-
sided polygons).

47
OpenGL Polygon Fill-Area Functions

48
 OpenGL Polygon Fill-Area Functions

• With the GL_QUADS primitive constant and the following

list of eight vertices, specified as two-dimensional
coordinate arrays, we can generate the display shown
in Figure 23(a):
glBegin (GL_QUADS);
glVertex2iv (p1);
glVertex2iv (p2);
glVertex2iv (p3);
glVertex2iv (p4);
glVertex2iv (p5);
glVertex2iv (p6);
glVertex2iv (p7);
glVertex2iv (p8);
glEnd ( );
49
 OpenGL Polygon Fill-Area Functions

• Rearranging the vertex list in the previous quadrilateral

code example and changing the primitive constant to
GL_QUAD_STRIP, we can obtain the set of connected
quadrilaterals shown in Figure 23(b):
glBegin (GL_QUAD_STRIP);
glVertex2iv (p1);
glVertex2iv (p2);
glVertex2iv (p4);
glVertex2iv (p3);
glVertex2iv (p5);
glVertex2iv (p6);
glVertex2iv (p8);
glVertex2iv (p7);
glEnd ( );
50
The End Summary of Chapter Three
T.Mariah Khayat

Adham University College

[email protected]

51