COMPUTER GRAPHICS

COMPUTER GRAPHICSAdri Jovin J.J.Assistant ProfessorDepartment of Information TechnologySRI RAMAKRISHNA INSTITUTE OF TECHNOLOGY1ONE DAY NATIONAL SEMINARONIES COLLEGE OF ENGINEERING

1

OUTLINE2

2

Basics of Computer Graphics3

Computing Classification SystemCCS Computing Methodologies Computer GraphicsGeometry+Principles of Engineering Graphics+Mapping with Display Device

3

What is Computer Graphics4The term computer graphics describes any use of computers to create and manipulate images.

can be two- or three-dimensional

has a wide range of application

4

Computer Aided Design5

5

Presentation Graphics6

6

Computer Art7

7

Entertainment8

8

Education and Training9

9

Visualization10

10

Image Processing11

11

Graphical User Interface12

12

Graphics Devices and Output Primitives13

13

Raster Scan Displays14

14

Architecture15

15

Random Scan Displays16

16

Architecture17

17

Color CRT Monitor18

18

Color CRT Monitor19

19

Flat Panel Displays20

20

Input Devices21

21

Trackball22

22

Space ball23

23

Joystick24

24

Image Scanner25

25

Touch Panel26

26

Light Pen27

27

Points and Lines28

setpixel(x,y) load a specified color point in the location specified by x and y

getpixel(x,y) retrieve the current frame buffer intensity

28

Line drawing algorithms29

29

DDA Algorithm30Digital Differential AnalyzerConsider positive slope and the slope is less than or equal to 1.We sample at unit x interval

For lines with positive slope, greater than 1, the roles of x and y are reversed

30

DDA Algorithm (Contd..)31If the process start from right end point, we haveTherefore

Similarly, for slope greater than 1,

31

Bresenham Line Drawing Algorithm32

32

2D Transformation - Translation33

33

2D Transformation - Translation34

34

2D Transformation - Rotation35

35

2D Transformation Uniform Scaling36

36

2D Transformation Differential Scaling37

37

2D Transformation Reflection38

38

2D Transformation Shear39

39

Composite 2D Transformation40

40

Line Clipping41

41

Line Clipping42

42

Polygon Clipping43

43

3D Concepts and Object Representations44

44

3D Display Methods45Parallel Projection

Perspective Projection

Depth Cueing

Visible Line and Surface Identification

45

Parallel Projection46

46

Perspective Projection47

47

Depth Cueing48

48

Visible Line and Surface Identification49

49

3D Graphic Packages50

Modeling Transformation

Viewing and ProjectionTransformation

WorkstationTransformationModeling CoordinatesWorldCoordinatesProjectionCoordinatesDeviceCoordinates

50

3D Object Representations51Boundary representations (B-reps) describe a three-dimensional object as a set of surfaces that separate the object interior from the environment.Space-partitioning representations used to describe interior properties, by partitioning the spatial region containing an object into a set of small, non-overlapping, contiguous solids (usually cubes).

51

Polygon Surfaces52most commonly used boundary presentation set of surface polygons enclose the object interiorUsed in most graphics systemssimplifies and speeds up the surface rendering and display of objects

52

Polygon Tables53

53

Plane Equations54Ax + By + Cz + D = 0, where (x,y,z) is any point on the plane.

54

Polygon Meshes55

55

Quadric Surfaces56Second Degree equationsSphere

Ellipsoid

56

Quadric Surfaces (Contd.)57Torus

57

Super Quadrics58Super ellipse

58

Super Quadrics59Superellipsoid

59

Blobby Objects60Metaball Model

Soft Object Model

60

Spline Representations61Interpolation Model

Approximation Model

61

Parametric Continuity62Zero-orderMeans simply that the curve meets

First orderThe first derivatives of two adjoining curve functions are equal (or) the tangents are shared

Second orderBoth the first order and the second order derivatives of two adjoining curve functions are equal

62

Bezier Surfaces63

63

B-Spline Curves and Surfaces64B- Spline Curves

64

B-Spline surfaces65

65

NURBS66Non-uniform Rational B-SplineUse of non-uniform knot-vector representations for constructing rational B-splines

66

Color Models67

67

RGB Color Model68Based on tristimulus theory of visioneyes perceive color through the stimulation of three visual pigments in the cones of the retinapeak sensitivity at wavelengths of about 630 nm (red), 530 nm (green), and 450 nm (blue)

Represented as a unit cube defined on R, G, B axes

Color Ck = RR + GG + BB

68

RGB Color Model (Contd..)69

"Cie Chart with sRGB gamut by spigget" by Spigget - Own work. Licensed under Creative Commons Attribution-Share Alike 3.0 via Wikimedia Commons - http://commons.wikimedia.org/wiki/File:Cie_Chart_with_sRGB_gamut_by_spigget.png#mediaviewer/File:Cie_Chart_with_sRGB_gamut_by_spigget.png

69

YIQ Color Model70National Television System Committee (NTSC) color model for forming the composite video signal

70

YIQ Color Model (Contd)71

"YIQ IQ plane" by Tonyle - Own work. Licensed under Creative Commons Attribution-Share Alike 3.0 via Wikimedia Commons - http://commons.wikimedia.org/wiki/File:YIQ_IQ_plane.svg#mediaviewer/File:YIQ_IQ_plane.svg

71

CMY Color Model72Defined with the primary colors cyan, magenta, and yellowUseful for describing color output to hard-copy devices

72

CMY Color Model (Contd)73

73

HSV Color Model74Color parameters in this model are hue ( H ) , saturation( S ) and value( V )3D representation is derived from RGB Cube.

74

Animations75

75

Animation Design Steps76Storyboard Layout

Object Definitions

Keyframe Specification

Generation of in-between frames

76

Storyboard77Storyboard is an outline of the action

Defines the motion sequence as a set of basic events that are to take place

77

Object Definition78Object definition is given for each participant in the action

Basic shapes, such as polygons or splines

Associated movements for each object are specified along with the shape.

78

Keyframe79Keyframe is a detailed drawing of the scene at a certain time in the animation sequence

Each object is positioned according to the time for that frame

79

In-betweens80In-betweens are the intermediate frames between the key frames

Determined by the media to be used to display the animationFilm : 24 fpsGraphics Terminals : 30 to 60 fps

80

Other Tasks81Motion Verification

Editing and Production

Synchronization of Sound Track

81

General Computer Animation82Some steps in the development of an animation sequence are well-suited to computer solution.Object Manipulation and RenderingCamera Motions ( Zooming, Tilting etc..)Generation of In-betweensStore and Manage Object Database

82

Raster Animations83On raster systems, we can generate real-time animation in limited applications using raster operations.

Simple 2D/ 3D transformations

Color Table Transformation

83

Key-frame Systems84MorphingTransformation of object shapes from one form to another

84

Morphing85

85

Morphing86

86

Graphics Processing Unit (GPU)87

87

Graphics Processing Unit (GPU)88Also known as Visual Processing Unit

Designed to rapidly manipulate and alter memory to accelerate the creation of images in a frame buffer intended for output to a display

Used in embedded systems, mobile phones, personal computers, workstations, and game consoles

Popularized by NVIDIA in 1999, who marketed the GeForce 256 as "the world's first GPU"

88

Graphics Processing Unit (GPU)89

89

90

90

OpenGL91Developed by Silicon Graphics in early 90s

Most widely-used open graphics standard in the world

Supports both 2D and 3D Graphics APIs

91

OpenGL (Contd..)92OpenGL applications use the window systems window, input, and event mechanism

GLU supports quadrics, NURBS, complex polygons, matrix utilities, and more

92

Playing the OpenGL Game93glutInit()Used to initialize the GLUT library

Usage:void glutInit(int *argcp, char **argv);

Description:Initialize the GLUT library and negotiate a session with the window system.

93

Playing the OpenGL Game..94glutInitWindowSize()Set the initial window size

Usage:void glutInitWindowSize(int width, int height);

Description:Windows created by glutCreateWindow will be requested to be created with the current initial window size.

94

Playing the OpenGL Game..95glutInitWindowPosition()Set the initial window position

Usage:void glutInitWindowPosition(int x, int y);

Description:Windows created by glutCreateWindow will be requested to be created with the current initial window position.

95

Playing the OpenGL Game..96glutInitDisplayMode()Set the initial window display mode.

Usage:void glutInitDisplayMode(unsigned int mode);mode - Display mode, normally the bitwise OR-ing of GLUT display mode bit masks

Description:Used when creating top-level windows, subwindows, and overlays to determine the OpenGL display mode for the to-be-created window or overlay.

96

Playing the OpenGL Game..97glutCreateWindow() Creates a top-level window.

Usage:int glutCreateWindow(char *name);

Description:Creates a top-level window. The intent is that the window system will label the window with the name.

97

Playing the OpenGL Game..98glutDisplayFunc()Sets the display callback for the current window.

Usage:void glutDisplayFunc(void (*func)(void));

Description:Sets the display callback for the current window. When GLUT determines that the normal plane for the window needs to be redisplayed, the display callback for the window is called. Before the callback, the current window is set to the window needing to be redisplayed and (if no overlay display callback is registered) the layer in use is set to the normal plane. The display callback is called with no parameters.

98

Playing the OpenGL Game..99glutMainLoop()Enters the GLUT event processing loop.

Usage:void glutMainLoop(void);

Description:Enters the GLUT event processing loop. This routine should be called at most once in a GLUT program. Once called, this routine will never return.

99

Playing the OpenGL Game..100glClearColor()Specify clear values for the color buffers.

Usage:void glClearColor(GLclampf red, GLclampf green, GLclampf blue, GLclampf alpha);

Description:Specifies the red, green, blue, and alpha values used by glClear to clear the color buffers

100

Playing the OpenGL Game..101glClearColor()Specify which matrix is the current matrix.

Usage:void glMatrixMode(GLenum mode);

Description:Sets the current matrix mode. mode can assume one of four values:GL_MODELVIEW GL_PROJECTION GL_TEXTUREGL_COLOR

101

Playing the OpenGL Game..102glClear()Clear buffers to preset values.

Usage:void glClear(GLbitfield mask);

Description:sets the bitplane area of the window to values previously selected by glClearColor, glClearIndex, glClearDepth, glClearStencil, and glClearAccum. Multiple color buffers can be cleared simultaneously by selecting more than one buffer at a time using glDrawBuffer.

102

Playing the OpenGL Game..103glColor3f()Set the current color.

Usage:void glColor3f(GLfloat red, GLfloat green, GLfloat blue);

Description:Current color values are stored in floating-point format, with unspecified mantissa and exponent sizes.

103

Playing the OpenGL Game..104glPointSize()Specify the diameter of rasterized points.

Usage:void glPointSize(GLfloat size);

Description:Specifies the rasterized diameter of both aliased and antialiased points.

104

Playing the OpenGL Game..105glFlush()Force execution of GL commands in finite time.

Usage:void glFlush( void);

Description:Empties all of these buffers, causing all issued commands to be executed as quickly as they are accepted by the actual rendering engine.

105

Playing the OpenGL Game..106glBegin() and glEnd()Delimit the vertices of a primitive or a group of like primitives.

Usage:void glBegin(GLenum mode);void glEnd( void);

Description:delimit the vertices that define a primitive or a group of like primitives.

106

Simple OpenGL with C++107#include #include #include void sample(){ glClearColor(1.0,1.0,1.0,0.0); glMatrixMode(GL_PROJECTION); gluOrtho2D(0,300,0,300); glClear(GL_COLOR_BUFFER_BIT); glColor3f(1.0,1.0,0.0); glPointSize(20); glBegin(GL_POINTS); glVertex2i(10,20); glEnd(); glFlush();}

int main(int argc, char **argv){ glutInit(&argc,argv); glutInitWindowSize(400,400); glutInitDisplayMode(GLUT_SINGLE|GLUT_RGB); glutInitWindowPosition(0,0); glutCreateWindow(Sample Window"); glutDisplayFunc(sample); glutMainLoop(); return 0;}

107

Thank you!!!108

108

???109

109