Date post: | 11-Jan-2016 |
Category: |
Documents |
Upload: | abigail-chambers |
View: | 222 times |
Download: | 0 times |
2003 CS Hons RW778 Graphics 1
Chapter 1: IntroductionChapter 1: Introduction
Admin:Admin:– Lecture slotsLecture slots:: Monday 8-9:45, Tuesday 9:15-11:00. Monday 8-9:45, Tuesday 9:15-11:00.
– BookBook: F. Hill, Computer Graphics Using OpenGL : F. Hill, Computer Graphics Using OpenGL (Little Big Bookstore)(Little Big Bookstore)
– EvaluationEvaluation: 3hr closed book, 8: 3hr closed book, 8thth week (50%) + weekly week (50%) + weekly pracs (50%)pracs (50%)
– PracsPracs: Windows or Linux, OpenGL. CAREFUL when : Windows or Linux, OpenGL. CAREFUL when using 3D Studio Max.using 3D Studio Max.
– This is a fun course, but also a LOT of hard workThis is a fun course, but also a LOT of hard work..
2003 CS Hons RW778 Graphics 2
Chapter 1 : IntroductionChapter 1 : Introduction
Week 1: Introduction and OpenGL (Hill, ChWeek 1: Introduction and OpenGL (Hill, Ch.. 1,2). 1,2). Week 2: Windows and viewports; vector tools Week 2: Windows and viewports; vector tools
(Hill, Ch(Hill, Ch.. 3,4). 3,4). Week Week 33: : VVector toolsector tools (continued) (continued) (Hill, Ch (Hill, Ch.. 4). 4). Week Week 44: Transformations : Transformations on objectson objects (Hill, Ch (Hill, Ch.. 5). 5). Week Week 55: : Polygonal Polygonal meshes (Hill, Chmeshes (Hill, Ch.. 6). 6). Week Week 66: 3D viewing (Hill, Ch: 3D viewing (Hill, Ch.. 7). 7). Week Week 77: Lighting and face realism (Hill, Ch: Lighting and face realism (Hill, Ch.. 8). 8). Week 8: Exam Week 8: Exam Wednesday 09:00Wednesday 09:00
2003 CS Hons RW778 Graphics 3
Chapter 1: IntroductionChapter 1: Introduction
1.1 What is computer graphics (CG)?1.1 What is computer graphics (CG)?– Simply picturesSimply pictures– ToolsTools– Field of studyField of study
1.2 Where is CG used?1.2 Where is CG used?– Art, entertainment, publishingArt, entertainment, publishing– Image processingImage processing– Process monitoring, simulations, CADProcess monitoring, simulations, CAD– Scientific visualizationScientific visualization
2003 CS Hons RW778 Graphics 4
Chapter 1: IntroductionChapter 1: Introduction
1.3 Elements of pictures created in CG1.3 Elements of pictures created in CG– Output primitives and attributes:Output primitives and attributes:
» PolylinesPolylines
» TextText
» Filled regionsFilled regions
» Raster imagesRaster images
– 1.3.1 Polylines1.3.1 Polylines» Connected sequence of straight lines Connected sequence of straight lines
2003 CS Hons RW778 Graphics 5
Chapter 1: IntroductionChapter 1: Introduction
» Edge, vertex, polygon, simple polygonEdge, vertex, polygon, simple polygon
» Attributes: color, thickness, dashing, endpoint Attributes: color, thickness, dashing, endpoint blendingblending
2003 CS Hons RW778 Graphics 6
Chapter 1: IntroductionChapter 1: Introduction
– 1.3.2 Text1.3.2 Text» Font, color, size, spacing, orientationFont, color, size, spacing, orientation
» Tilting (graphs)Tilting (graphs)
– 1.3.3 Filled regions1.3.3 Filled regions» Filled shape – boundary (polygon)Filled shape – boundary (polygon)
» Filling used for shadow effects Filling used for shadow effects
2003 CS Hons RW778 Graphics 7
Chapter 1: IntroductionChapter 1: Introduction
– 1.3.4 Raster image1.3.4 Raster image» Consists of cells (called pixels) with color valueConsists of cells (called pixels) with color value
» Stored as array of numerical valuesStored as array of numerical values
» Bitmap : 0-1Bitmap : 0-1
» Created as hand-designed, or computed, or scanned.Created as hand-designed, or computed, or scanned.
» Computed: straight lines – “jaggies” Computed: straight lines – “jaggies”
» Easy manipulation (filters, cleanup)Easy manipulation (filters, cleanup)
2003 CS Hons RW778 Graphics 8
Chapter 1: IntroductionChapter 1: Introduction
– 1.3.5 Shades of gray and color in raster images1.3.5 Shades of gray and color in raster images» Pixel depth : n bits => 2Pixel depth : n bits => 2n n values (at least 256)values (at least 256)
» Smaller pixel depth => loss in quality. Banding.Smaller pixel depth => loss in quality. Banding.
» Color: RGBColor: RGB
» Color depth => sum of bits for each colorColor depth => sum of bits for each color
» High quality (true color) : 24 bits (eye perception)High quality (true color) : 24 bits (eye perception)
1.4 Graphics Display Devices1.4 Graphics Display Devices– 1.4.1 Line drawing (plotters): cross-hatching1.4.1 Line drawing (plotters): cross-hatching
2003 CS Hons RW778 Graphics 9
Chapter 1: IntroductionChapter 1: Introduction
– 1.4.2 Raster displays (video monitor, flat-panel 1.4.2 Raster displays (video monitor, flat-panel displays, printers)displays, printers)
» Display surface (X,Y)Display surface (X,Y)
» Frame buffer : memory to hold display pixels, with Frame buffer : memory to hold display pixels, with scan controller.scan controller.
2003 CS Hons RW778 Graphics 10
Chapter 1: IntroductionChapter 1: Introduction
» Some hardware (video monitor) requires “refresh” : Some hardware (video monitor) requires “refresh” : entire frame buffer scanned out to display many entire frame buffer scanned out to display many times per second.times per second.
2003 CS Hons RW778 Graphics 11
Chapter 1: IntroductionChapter 1: Introduction
» Video monitors :Video monitors : CRTCRT Digital-to-analog converters (DACs)Digital-to-analog converters (DACs) Refresh 60x per second to prevent flicker.Refresh 60x per second to prevent flicker. Scanning per lineScanning per line
2003 CS Hons RW778 Graphics 12
Chapter 1: IntroductionChapter 1: Introduction
– 1.4.3 Indexed Color and the LUT1.4.3 Indexed Color and the LUT» Programmable association between pixel value and colorProgrammable association between pixel value and color
» Bits in frame buffer acts as index into LUT.Bits in frame buffer acts as index into LUT.
» Palette: set of possible colors AT ONE TIME.Palette: set of possible colors AT ONE TIME.
– 1.4.4 Other raster display devices: flat-panel, LCD, 1.4.4 Other raster display devices: flat-panel, LCD, active matrix panels, plasma panel active matrix panels, plasma panel
– 1.4.5 Hard-copy raster devices: film recorder, laser 1.4.5 Hard-copy raster devices: film recorder, laser printer, inkjet plotter. printer, inkjet plotter. PostScriptPostScript..
1.5 Graphics input primitives and devices1.5 Graphics input primitives and devices– Selfstudy.Selfstudy.
2003 CS Hons RW778 Graphics 13
Chapter 2: Drawing in OpenGLChapter 2: Drawing in OpenGL
2.1 Getting started2.1 Getting started– Environment: window, coordinate system, Environment: window, coordinate system,
elementary drawing routineselementary drawing routines– 2.1.1 Device-independence and OpenGL2.1.1 Device-independence and OpenGL
» LibrariesLibraries
– 2.1.2 Windows-based Programming2.1.2 Windows-based Programming» Event-driven, event queue and callbacksEvent-driven, event queue and callbacks
» System-dependent (glut)System-dependent (glut)
» Example: Fig. 2.2Example: Fig. 2.2
2003 CS Hons RW778 Graphics 14
Chapter 2: Drawing in OpenGLChapter 2: Drawing in OpenGL
#include <gl/Gl.h>#include <gl/Gl.h>
#include <gl/glut.h>#include <gl/glut.h>
//<<<<<<<<<<<<<<<<<<<<<<<< main >>>>>>>>>>>>>>>>>>>>>>//<<<<<<<<<<<<<<<<<<<<<<<< main >>>>>>>>>>>>>>>>>>>>>>
void main(int argc, char** argv)void main(int argc, char** argv)
{{
// initialize// initialize
// create screen window// create screen window
glutDisplayFunc (myDisplay);glutDisplayFunc (myDisplay);
glutMouseFunc (myMouse);glutMouseFunc (myMouse);
glutKeyboardFunc (myKeyboard);glutKeyboardFunc (myKeyboard);
glutMainLoop(); glutMainLoop(); // go into a perpetual loop // go into a perpetual loop
}}
2003 CS Hons RW778 Graphics 15
Chapter 2: Drawing in OpenGLChapter 2: Drawing in OpenGL
– 2.1.3 Opening a window for drawing (framework)2.1.3 Opening a window for drawing (framework)
#include <gl/Gl.h>#include <gl/Gl.h>
#include <gl/glut.h>#include <gl/glut.h>
//<<<<<<<<<<<<<<<<<<<<<<<< main >>>>>>>>>>>>>>>>>>>>>>//<<<<<<<<<<<<<<<<<<<<<<<< main >>>>>>>>>>>>>>>>>>>>>>
void main(int argc, char** argv)void main(int argc, char** argv)
{{
glutInit(&argc, argv); // initialize the toolkitglutInit(&argc, argv); // initialize the toolkit
glutInitDisplayMode(GLUT_SINGLE | GLUT_RGB); // set display modeglutInitDisplayMode(GLUT_SINGLE | GLUT_RGB); // set display mode
glutInitWindowSize(640,480); // set window sizeglutInitWindowSize(640,480); // set window size
glutInitWindowPosition(100, 150); // set window position on screenglutInitWindowPosition(100, 150); // set window position on screen
glutCreateWindow("my first attempt"); // open the screen windowglutCreateWindow("my first attempt"); // open the screen window
glutDisplayFunc(myDisplay); // register redraw functionglutDisplayFunc(myDisplay); // register redraw function
myInit(); myInit();
glutMainLoop(); glutMainLoop(); // go into a perpetual loop // go into a perpetual loop
}}
2003 CS Hons RW778 Graphics 16
Chapter 2: Drawing in OpenGLChapter 2: Drawing in OpenGL
2.2 Drawing basic graphics primitives2.2 Drawing basic graphics primitives– Establish coordinate systemEstablish coordinate system– Line drawing primitives : glBegin, glEnd, Line drawing primitives : glBegin, glEnd,
verticesvertices– Example:Example:
glBegin (GL_POINTS);glBegin (GL_POINTS);
glVertex2i(100,50);glVertex2i(100,50);
glVertex2i(100,130);glVertex2i(100,130);
glVertex2i(150,130);glVertex2i(150,130);
glEnd();glEnd();
- OpenGL commands: glVertex2i (…)OpenGL commands: glVertex2i (…)
2003 CS Hons RW778 Graphics 17
Chapter 2: Drawing in OpenGLChapter 2: Drawing in OpenGL
– OpenGL data types : GLint, GLfloatOpenGL data types : GLint, GLfloat– OpenGL state: current state variables. OpenGL state: current state variables.
» glColor3f (red, green, blue)glColor3f (red, green, blue)
» glClear (GL_COLOR_BUFFER_BIT)glClear (GL_COLOR_BUFFER_BIT)
– Establish coordinate systemEstablish coordinate system» Matrices and transformations (ch. 3)Matrices and transformations (ch. 3)
– Fig. 2.10: A complete OpenGL programFig. 2.10: A complete OpenGL program» Note Note glFlush();glFlush();
2003 CS Hons RW778 Graphics 18
Chapter 2: Drawing in OpenGLChapter 2: Drawing in OpenGL
– 2.2.1 Drawing dot constellations2.2.1 Drawing dot constellations» The Big DipperThe Big Dipper
» The Sierpinski GasketThe Sierpinski Gasket
» Simple dot plots (note scaling and shifting, which Simple dot plots (note scaling and shifting, which are affine transformations)are affine transformations)
2.3 Line Drawings2.3 Line Drawings
glBegin (GL_LINES);glBegin (GL_LINES);
glVertex2i(40, 100);glVertex2i(40, 100);
glVertex2i(202, 96);glVertex2i(202, 96);
glEnd();glEnd();
2003 CS Hons RW778 Graphics 19
Chapter 2: Drawing in OpenGLChapter 2: Drawing in OpenGL
– More than 2 vertices : pairedMore than 2 vertices : paired– 2.3.1 Drawing polylines and polygons2.3.1 Drawing polylines and polygons
» Polyline: collection of joined line segments, Polyline: collection of joined line segments, specified by ordered list of points.specified by ordered list of points.
» OpenGL: GL_LINE_STRIP (open line segment)OpenGL: GL_LINE_STRIP (open line segment)
» GL_LINE_LOOP (closed line segment – not fillable GL_LINE_LOOP (closed line segment – not fillable area – GL_POLYGON)area – GL_POLYGON)
» Examples: line graphs, polylines from file, Examples: line graphs, polylines from file, parameterizing figures, polyline drawerparameterizing figures, polyline drawer
2003 CS Hons RW778 Graphics 20
Chapter 2: Drawing in OpenGLChapter 2: Drawing in OpenGL
– 2.3.2 Line drawing with 2.3.2 Line drawing with moveto()moveto() and and lineto()lineto()
» Current positionCurrent position
– 2.3.3 Drawing aligned rectangles2.3.3 Drawing aligned rectangles» glRecti(x1,y1,x2,y2)glRecti(x1,y1,x2,y2)
– 2.3.4 Aspect ratio of aligned rectangle2.3.4 Aspect ratio of aligned rectangle» width/heightwidth/height
» NB! Work through all practice exercises on pp. 60—NB! Work through all practice exercises on pp. 60—61.61.
2003 CS Hons RW778 Graphics 21
Chapter 2: Drawing in OpenGLChapter 2: Drawing in OpenGL
– 2.3.5 Filling polygons2.3.5 Filling polygons» Must be convex!Must be convex!
– 2.3.6 Other graphics primitives:2.3.6 Other graphics primitives:» GL_TRIANGLES,GL_QUADS,GL_TRIANGLE_STRIPGL_TRIANGLES,GL_QUADS,GL_TRIANGLE_STRIP» GL_TRIANGLE_FAN,GL_QUAD_STRIPGL_TRIANGLE_FAN,GL_QUAD_STRIP
2003 CS Hons RW778 Graphics 22
Chapter 2: Drawing in OpenGLChapter 2: Drawing in OpenGL
2.4 Simple mouse and keyboard interaction2.4 Simple mouse and keyboard interaction– glut callbacks on events:glut callbacks on events:
glutMouseFunc, glutMotionFunc, glutMouseFunc, glutMotionFunc, glutKeyboardFuncglutKeyboardFunc
– 2.4.1 Mouse interaction : selfstudy2.4.1 Mouse interaction : selfstudy
– 2.4.2 Keyboard interaction : selfstudy2.4.2 Keyboard interaction : selfstudy
2.6 Case studies: SELFSTUDY2.6 Case studies: SELFSTUDY
2003 CS Hons RW778 Graphics 23
Chapter 2: Drawing in OpenGLChapter 2: Drawing in OpenGL
Programming Task 1Programming Task 1 : Implement Case : Implement Case Study 2.5 (Polyline Stippling), p. 75, in Hill.Study 2.5 (Polyline Stippling), p. 75, in Hill.
Familiarize yourself with OpenGL, Linux Familiarize yourself with OpenGL, Linux (or Windows) and C/C++.(or Windows) and C/C++.
The usual rules for programming projects The usual rules for programming projects hold: hold: – No extensions (demo Monday 08:00)No extensions (demo Monday 08:00)– No copying/cheatingNo copying/cheating– Accompanying report to be handed in at demoAccompanying report to be handed in at demo