Embed Size (px)
Citation preview
Chapter 3 Computer Graphics Software
Computer Graphics
Outline Graphics Software Packages
Introduction to OpenGL
Example Program
2
Graphics Software
3
Software packages General Programming Graphics Packages
GL (Graphics Library, 1980s) [SGI], OpenGL(1992), GKS (GraphicalKernel System, 1984), PHIGS (Programmer’s Hierarchical InteractiveGraphics System), PHIGS+, VRML(superseded by X3D), Direct3D,Java2D/Java3D
Special - Purpose Application Packages CAD /CAM, Business, Medicine, Arts ( for Animation: 3ds Max, Maya
[Autodesk, originally Alias (formerly Alias|Wavefront)] )
Computer-graphics application programming interface (CGAPI) A set of graphics functions to let programmers control hardware A software interface between a programming language and the hardware.
E.g.: GL, OpenGL, Direct3D
Functions of Graphics Packages Functions provided by general graphics packages are to
create and manipulate pictures Graphics Output Primitives: lines, curves, spheres… Primitive Attributes: color, line styles… Geometric Transformations Viewing Transformations Input Functions: data flow from mouse, joystick, … Control Operations
4
Algorithms A number of basic algorithms are needed:
Transformation: convert models/primitives from one coordinate systemto another
Clipping/Hidden surface removal: remove primitives and part ofprimitives that are not visible on the display
Rasterization: convert a projected screen space primitive to a set of pixels.
Advanced: Shading and illumination: simulate the highly realistic lighting effect of
a scene.
Animation: simulate movement by rendering a sequence of frames.
Parallel processing & real time rendering for graphics computation,in particular to large and/or natural environments.
Physically based graphics modeling and rendering.
5
Graphics Rendering Process Rendering purpose: the conversion of a 3D scene into a
2D image
render2D Image
6
Graphics Rendering Pipeline
Fixed graphics Pipeline in hardware
Programmable pipeline in hardware
Modeling (local/master) coordinates (MC)A separate coordinates reference frame for object. Local coordinate system (2D or 3D) Define the coordinates for each object individually Scale and unit are varied from object to object
World coordinates (WC)A scene reference frame where the objects are placed at appropriate locations. Global coordinate system (2D or 3D) Place all defined objects together in a scene within this reference system MC WC (modeling transformation)
Coordinate (坐標) Representations in Graphics Rendering Pipeline
7
Viewing and projection coordinates World coordinates positions are transformed though the viewing pipeline to viewing and
projection coordinates. (Viewing transformation)
Normalized (device) coordinates (NC) Make coordinate independent to any specific output device (device-independent) The scene is stored in normalized coordinates, range from -1 to 1, or 0 to 1. Stage between WC and DC
Device (screen) coordinate (DC) Display coordinate system on the output device (e.g, screen) 2D only Platform dependent
8
Coordinate Representations in Graphics Rendering Pipeline
Graphics Rendering Pipeline
9
Model
Model
Model
M1
M2
M3
3D WorldScene
3D ViewSceneV
P Clip Normalize 2D/3D DeviceScene
2D ImageProjection
Rasterization
ModelingTransformations
ViewingTransformations
MCS
WCS VCS
NDCSDCSSCS
(From CENG477 notes, 09)
Introduction to OpenGL OpenGL (Open Graphics Library)
[developed by Silicon Graphics Inc. (SGI) in 1992, and maintained by OpenGLArchitectural Review Board (OpenGL ARB), the group of companies that would maintainand expand the OpenGL specification until 2006; by Khronos Group until now ]
10
Khronos Group (http://www.khronos.org/)
[a nonprofit industry consortium creating open standards for theauthoring and acceleration of parallel computing, graphics, dynamicmedia, computer vision and sensor processing on a wide variety ofplatforms and devices. ]
Introduction to OpenGL OpenGL (Open Graphics Library)
A common graphics library which provides functions fordrawings and interactive input.
A cross-language, cross-platform API No command for performing windowing tasks
No command for handling input
Accessible via C/C++, Java…http://www.opengl.org
11
Introduction to OpenGL OpenGL basic (core) library (opengl32.lib | opengl.lib) Over 250 functions, specifying objects and operations needed to
produce interactive 3D graphics OpenGL geometric primitives include points, lines and polygons;
specific support for triangle and quadrilateral polygons; quadric(defined by quadratic equation) and NURBES (spline) surface.
Texture mapping support. …… From OpenGL 2.0: Programmable shader support
12
Introduction to OpenGL Related libraries for specific windowing systems GLX: X-Window System (Linux, Unix, OS X) Prefix glx
WGL: Microsoft Windows 16 functions
Prefix wgl
Appel GL (AGL): Apple
OpenGL Auxiliary Lib. (glaux.lib) 31 functions, for Windows NT|95, 98, 2000 mainly.
Prefix aux
13
Introduction to OpenGL Related libraries OpenGL Utility (GLU) (glu32.lib | glu.lib) 43 functions
Setting up viewing and projection matrices
Complex objects
Line and polygon approximations
Displaying quadrics, B-splines, surface rendering
Prefix glu
OpenGL Utility Toolkit (GLUT) (glut32.lib) A windowing application programming interface (API) for OpenGL
About 30 functions, for interacting with any screen-windowing system, plus quadric curves and surfaces.
Prefix glut
14
OpenGL Utility Toolkit (GLUT)-Written by Mark Kilgard formerly in SGI, now in NVIDIA
A window-system independent toolkit
NOT a part of OpenGL
BUT a windowing API for OpenGL, so no need to know The details of different platform: GLX, WGL, and AGL
The details of opening a window and an OpenGL context across operatingsystems.
The details of various input devices, such as keyboard and mouse.
Widely used in demonstration programs and literature.
15
GLUT – Hello World
Open a window
16
display function is defined as void (*func) (void) { };A callback function which is registered by glutDisplayFunc as a routine to invoke when the window need to be redisplayed.
OpenGL Syntax Functions, symbols, and types
glBegin, glClear, glCopyPixels, glPolygonModeGL_2D, GL_POLYGON, GL_BUFFER_BITGLbyte, GLshort, GLint, GLfloat, GLdouble
Prefix gl Each component word in the function name has its first letter
capitalized Arguments are assigned symbolic constants specifying
parameter names, values of parameters, or a mode. Constants defined with GL_, and underscores separate words. OpenGL defines its own types which correspond to C types
GLbyte: signed char; GLshort:short; GLint: int; GLfloat: float…
17
OpenGL Syntax Functions are always named in the following manner
glColor3f(0.0f, 0.0f, 0.0f)
gl + actual function name + number of arguments +type of arguments
Number of arguments: 2, 3, 4 Type of arguments: s, i, f, d, ub, v… (v indicates it’s a
vector/array)
18
OpenGL Syntax Example glColor3f(0.0f, 0.4f, 0.8f);
This is: 0% Red, 40% Green, 80% Blue
glColor4f(0.1, 0.3, 1.0, 0.5) ;This is: 10% Red, 30% Green, 100% Blue, 50% Opacity
GLfloat color[4] = {0.0, 0.2, 1.0, 0.5};glColor4fv( color );It is 0% Red, 20% Green, 100% Blue, 50% Opacity
19
Introduction to OpenGL Compiling: Header Files gl.h, glu.h, glut.h, glaux.h (windows.h for WGL routines)
* If you use GLUT to handle the window-managing operations, only#include <glut.h> needed, gl.h and glu.h have been included.
Linking: Dynamic Link Lib opengl32.dll
glu32.dll
glut32.dll
20
An Example of OpenGL Initialize OpenGL and GLUT
Initialize a drawing window
Draw a line segment
21
An Example of OpenGL
22
An Example of OpenGL//give the initial location for the top-left corner of the display window
glutInitWindowPosition (50, 100);//set the initial pixel width and height of the display window
glutCreateWindowSize (400, 300);
23
Figure 3-2 A 400 by 300 display window at position (50, 100) relative to the top-left corner of the video display.
End of Chapter 3
24
Summary Basic display devices
Input devices
Graphics software packages
Graphics rendering pipeline and coordinate representations
OpenGL introduction
25
Chapter 4 Graphics Output Primitives
(Part I)
Computer Graphics
Outline Definition of graphics output primitives
Coordinate Reference Frames
OpenGL Point Functions
OpenGL Line Functions
Implementation Algorithm: Line-Drawing Algorithms(Chapter 6) DDA
Bresenham
27
DefinitionsOne 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, ……
28
Coordinate Reference Frames World coordinate system Cartesian coordinates (笛卡尔坐标) A right hand coordinate system Label the axes as
X (horizontal)
Y (vertical)
Z (in 3D)
Origin is in the lower left
X Axis
Y Axis
(0,0) +X
+Y
29
Partition Space into Pixels Object information, such as the coordinates, colors, is passed to
the viewing routines.
Map the 3D objects to positions on the 2D screen
Scan-conversion methods Converts vector images (primitives such as lines, circles, etc.) into raster
images (integer pixel values)
Geometric description discrete pixel representation30
Rasterization(光柵化)
Screen Coordinate System Screen: 2D coordinate system (W*H)
Two definitions for screen coordinatesystem: For hardware processes, such as screen
refreshing, the origin is at the top-leftcorner of the screen y - scan line number; x - column number.
For software, the origin is at the low-leftcorner (OpenGL convention)
Correspond to the pixel positions in theframe buffer
X Axis
Y Axis
(0,0) +X
+Y
31
Quick review:What’s the pixel?
“pixel” is a screen spot.From a geometry point of view, a pixel is a point. Q: Where is the pixel P(2,1) on the screen?
2
2
1
10 3 4
3
532
How to represent each pixel position by the screen coordinates? Is it a square or a point?
Therefore, when we think about images, a pixel is a rectangle or the inscribed circle. Q: Where is P(2,1) on the screen? A: the center of a pixel located.
1
2
0
10 3 4
2
33
Basic OpenGL Point Structure In OpenGL, to specify a point:
glVertex*(); (*) indicates the suffix codes needed
glVertex2i(80, 100), glVertex2f(58.9, 90.3) glVertex3i(20, 20, -5), glVertex3f(-2.2, 20.9, 20)
Must put within a ‘glBegin/glEnd’ pairglBegin(GL_POINTS);
glVertex2i(50, 100);glVertex2i(75, 150);glVertex2i(100, 200);
glEnd();
The form of a point position in OpenGL spec.:
glBegin (GL_POINTS); glVertex* ();
glEnd ();
34
[ gl + actual function name + number of arguments + type of arguments ]
Symbolic constant
OpenGL Point Functions Some examples of specifying points in OpenGL
//Specify the coordinates of points in arrays; then call the OpenGL functionsint point1 [] = {50, 100};int point2 [] = {75, 150};int point3 [] = {100, 200};
glBegin (GL_POINTS);glVertex2iv (point1);glVertex2iv (point2);glVertex2iv (point3);
glEnd ();
//Specify the points in 3D world reference frameglBegin (GL_POINTS);
glVertex3f (-78.05, 909.72, 14.60);glVertex3f (261.91, -5200.67, 188.33);
glEnd ();35
OpenGL Point Functions Some examples of specifying points in OpenGL (cont.)
// In C++, define a C++ class or structure of a pointclass wcPt2D {
public:GLfloat x, y;
};
wcPt2D pointPos;
pointPos.x = 120.75;pointPos.y = 45.30;
glBegin (GL_POINTS);glVertex2f (pointPos.x, pointPos.y);
glEnd ();
36
OpenGL Line Functions
glBegin (GL_LINES);glVertex2iv (p1);glVertex2iv (p2);glVertex2iv (p3);glVertex2iv (p4);glVertex2iv (p5);
glEnd ();
glBegin (GL_LINE_STRIP);glVertex2iv (p1);glVertex2iv (p2);glVertex2iv (p3);glVertex2iv (p4);glVertex2iv (p5);
glEnd ();
p2
p1p3
p4
p2
p1p3
p4
p5
37
In OpenGL, to specify one or more straight-line segments:
OpenGL Line Functions
glBegin (GL_LINE_LOOP);glVertex2iv (p1);glVertex2iv (p2);glVertex2iv (p3);glVertex2iv (p4);glVertex2iv (p5);
glEnd ();
p2
p1p3
p4
p5
38
In OpenGL, to specify one or more straight-line segments(cont.):
Implementation Algorithm: Line drawing algorithms
Digital Differential Analyzer (DDA)
Bresenham’s Line Algorithm
39
Line-Drawing Algorithms The ideal line Continuous appearance Uniform thickness and brightness
Line on a raster monitor Screen: discrete pixels Digitize the line into a set of discrete integer positions approximating
the actual line path.
40
Line-Drawing Algorithms
(17,8)
(2,2)
41
Discretization - converting a continuous signal into discrete elements.
Scan conversion line-drawing algorithm: convert the line information into pixel data for display
Line-Drawing Algorithms How to calculate the pixel positions along a straight-line path
The line equation (slope-intercept equation): any point (x, y) on theline must follow it.
y = m • x + b, where m is the slope (斜率) of the line. b is the intercept on y-axis.
If we have two endpoints, (x0, y0) and (xend, yend), then m and b canbe calculated as:
m = y / x = (yend – y0) / (xend – x0)
b = y0 - m . x0
42
Line-Drawing Algorithms
which is the nearest pixel to the line at each sampled position.
Two line-drawing algorithms:(1) DDA (Digital Differential Analyzer).(2) Bresenham’s Line Algorithm.43
On raster system, the line is approximated by pixels. How good it is, decided by: how to sample a line at discrete positions (step sizes of the
calculation in the horizontal (x) and vertical (y) directions)
(1) Line drawing – DDA algorithm (DDA) is a scan-conversion line algorithm based on calculating
either y or x. Each point is generated from the previous point Take a unit step with one coordinate and calculate the corresponding value
for another
Slope of a line m = Δy/Δx
y = m • x or x = y / m
Different cases based on the sign of the slope, value of the slope, and the direction of drawing. Slope sign: positive or negative.
Slope value: <= 1 or >1.
Direction: (left – right) or (right – left)
x
y
44Four Quadrants
III
III IV
DDA algorithm
a low level procedure to store the current color into the frame buffer at (x, y)
// if |m|<1, | ∆x | =1.
// if |m|>1, | ∆y | =1.
45
y = m • xx = y / m
Line drawing – DDA algorithm DDA summary
1. Go to starting point2. Increment x and y values Step size:
- one unit (in x or y direction)
- calculating corresponding value for another
3. Round to the closest raster position
Merits
Relative fast: replace the multiplication by using the increments
of x or y directions to step from one pixel to another.
Drawbacks Divisions needed to set increment values
The use of floating-point arithmetic
Rounding operations to an integer46
(2) Bresenham’s Line Algorithm An efficient algorithm for line drawing
Using only integer addition/subtraction
We have a point (xk, yk), then at each sampling step Two possible pixel positions: A (xk+1, yk)
and B (xk+1, yk+1)
To decide which is closer to the line path
47
The vertical axes show scan-line positions;The horizontal axes identify pixel columns.
A
B
dA
dB
Bresenham’s Line Algorithm for |m|<1.01. Input the two line endpoints and store the left one (x0, y0).2. Plot (x0, y0) to be the first point (set the color for frame buffer position (x0,
y0)).3. Calculate the constants ∆x, ∆y, 2∆y, and 2∆y – 2∆x, and obtain the starting
value for the decision parameter as p0 = 2∆ y – ∆x.4. At each xk along the line, starting at k = 0, perform the following test.
If pk < 0, plot (xk+1, yk) and pk+1 = pk + 2∆y
Otherwise, plot (xk+1, yk+1) and pk+1 = pk + 2∆y – 2∆x.
5. Perform step 4 ∆x – 1 times.
48
yk+1
xk+1
ydlower
dupper
yk A
B
Bresenham’s Line Algorithm Example Note: This Bresenham’s algorithm is used when slope |m|< 1.
Example 3-1: Using Bresenham’s Line-Drawing Algorithm, digitize the line with endpoints (20,10) and (30,18).
-- y = 18 – 10 = 8-- x = 30 – 20 = 10-- m = y / x = 0.8
plot the first point (x0, y0) = (20, 10) p0 = 2 y – x = 2 • 8 – 10 = 6 , so the next point is (21, 11)
The next point is (xk+1, yk+1)
49
K Pk (xk +1, yk +1) K Pk (xk +1, yk +1)
0 6 (21,11) 5 6 (26,15)
1 2 (22,12) 6 2 (27,16)
2 -2 (23,12) 7 -2 (28,16)
3 14 (24,13) 8 14 (29,17)
4 10 (25,14) 9 10 (30,18)
Pk > 0: Pk+1 = Pk + 2∆y – 2∆x Pk < 0: Pk+1 = Pk + 2∆y
50
The successive pixel positions along the line path can be determined from the decision parameter as
Bresenham’s Line Algorithm Example
y = 8; x = 10
Bresenham’s Line Algorithm Example Pixel positions along the line path between endpoints (20, 10)
and (30, 18), plotted with Bresenham’s algorithm.
51
(20, 10); (21,11); (22,12); (24,13); (25,14); …; (30,18).
Bresenham’s Line Algorithm for |m|<1.0
52
Pk > 0: Pk+1 = Pk + 2∆y – 2∆x
Pk < 0: Pk+1 = Pk + 2∆y
Setting Frame Buffer Values The final stage of line segment implementation is to set the frame-
buffer color values. Suppose: The frame buffer is stored in memory as an addressable array.
The frame buffer array is stored row by row (row-major order).
Pixel positions are labeled from (0,0) at the lower-left screen corner to(xmax, ymax) at the top-right corner.
53
For a bilevel (one bit per pixel) system, the frame buffer bit address for the pixel at (x, y): addr(x, y) = addr(0, 0) + y•(xmax + 1) + x
Summary OpenGL output primitives functions Point and line
Line drawing algorithm DDA Bresenham
54
END
55
DDA – case 1 (1st quadrant) Positive slope; left to right: If 0 <= m <= 1 then:
xk+1 = xk + 1yk+1 = yk + m(rounded to the nearest integercorresponding to a screen pixelposition in x coordinate)
If m > 1 then:xk+1 = xk + 1/myk+1 = yk + 1
y = m • xx = y / m
56Four Quadrants
I
DDA – case 2 (3rd quadrant) Positive slope; right to left:
If 0 < m <= 1 then:xk+1 = xk – 1 yk+1 = yk – m
If m > 1 then:xk+1 = xk – 1/myk+1 = yk – 1
57
y = m • xx = y / m
Four Quadrants
III
DDA – case 3 (4th quadrant) Negative slope; left to right:
If |m | <= 1 then:xk+1 = xk + 1yk+1 = yk – |m|
If |m | > 1 then:xk+1 = xk + 1/|m|yk+1 = yk – 1
58
y = m • xx = y / m
Four Quadrants
IV
DDA – case 4 (2nd quadrant) Negative slope; right to left:
If |m | <= 1 then:xk+1 = yk+1 =
If |m | > 1 then:
xk+1 =
yk+1 =
59
y = m • xx = y / m
Four Quadrants
xk – 1yk + |m|
xk – 1/|m|yk + 1
?
?
?
?
II
Bresenham’s Line AlgorithmConsider lines with positive slope less than 1.0: At sampling point xk+1, we label vertical pixel separations from
the mathematical line path as dlower and dupper. After calculating dlower and dupper we will choose yk or yk+1.
y = m (xk + 1) + b
dlower = y – yk = m (xk + 1) + b – yk
dupper = (yk+1) – y = yk+1 - m (xk + 1) – b
An efficient test:dlower – dupper = 2m • xk + 2m – 2yk + 2b – 1
= 2m (xk + 1) – 2yk + 2b – 1y = m x + b
60
A
BC
Bresenham’s Line Algorithm To derive the decision parameter for the kth step: pk
dlower – dupper = 2m (xk + 1) – 2yk + 2b – 1
m = y / x
∆x (dlower – dupper ) = 2 ∆ y (xk + 1) – ∆ x (2yk – 2b +1)
= 2 ∆ y • x k – 2 ∆ x • yk + c
where c = 2 ∆ y + ∆ x (2b – 1) is a constant; and k represents the kth step.
pk = ∆x (dlower – dupper ) = 2 ∆ y • x k – 2 ∆ x • yk + c
61
Bresenham’s Line Algorithmpk = ∆x (dlower – dupper ) = 2 ∆ y • x k – 2 ∆ x • yk + c
If pk < 0 (i.e. dlower < dupper) we plot the pixel A (xk+1, yk)
Otherwise we plot the pixel B (xk+1, yk+1)
yk+1
xk+1
ydlower
dupper
yk
62
A
B
C
Bresenham’s Line Algorithm Go on to the next step, we need to decide the pk+1: pk pk+1
From pk = 2 ∆ y • x k – 2 ∆ x • yk + c, we can get pk+1 = 2 ∆ y • x k+1 – 2 ∆ x • yk+1 + c,
where c = 2 ∆ y + ∆ x (2b – 1) is a constantTherefore, pk+1 – pk = 2 ∆ y (x k+1 – x k) – 2 ∆ x (yk+1 – yk )
pk+1 = pk + 2 ∆y – 2 ∆x (yk+1 – yk)
The first parameter p0 = 2 ∆ y – ∆ xhint: from (x0, y0) and m= ∆y/ ∆ x, k = 0.
xk+1 = xk + 1
x0+1
ydlower
duppery0+1
y0
0 or 1, depending on the sign of pk
63
