COIS712/ECOM708/COIS800

1. COIS712/ECOM708/COIS800 Computer Graphics – Principles & Systems Advanced Computer Graphics and Multimedia Advanced Computer Graphics & VirtualSimulation Chapter5 Attributes of GraphicsPrimitives

2. Chapter5. Attributes of GraphicsPrimitives PartI. Color, point and lineattributes OpenGLfunctions

3. Outline • OpenGL State Machine andVariables • Color and GrayScale • OpenGL ColorFunctions • OpenGL Point-AttributeFunctions • OpenGL Line-AttributeFunctions

4. OpenGL StateMachine • State system (or statemachine) • A graphics system that maintains a list for the current values of attributes and other parameters (state variables or stateparameters). • We assign a value to one or more state parameters, that is, we put the system into a certainstate. • The state will be persistent until we change the value of a state parameter. • tochange • tochange • State3 …… State1 State2 tochange

5. OpenGL StateMachine • OpenGL is a finite statemachine • A predetermined and countable number of differentstates • The graphics system behaviors are determined by these system state, which can be modified by calling OpenGLfunctions. • The OpenGL stateincludes: … glMatrixMode (GL_PROJECTION); glLoadIdentity(); gluOrtho2D( …); … • The current color or other attributes • The current model & viewingtransformations • The current camera model &clipping • The current lighting & reflectance model • The currentviewport • All have default values, remaining until a new setting onit.

6. OpenGL StateMachine • A commonmisconception • The primitive drawing functions are statechanges • They are the output functions telling the system to draw something to the screen with the certain specified currentstate. • The options of the currentstate • the currentcolor • the current pointsize • the depth function - enabled ornot • … glColor3f(0.0, 0.0,0.0); glPointSize(1.5);

7. OpenGL StateMachine • What do you do to maintain states and state variables by OpenGL? • To set states for drawing geometricprimitives • E.g: glPointSize ( size ); glLineStipple ( repeat, pattern); • glShadeModel ( GL_ SMOOTH); • or change (enable) states of how OpenGL drawsthem • By default, most of these states are initially inactive. • Such states include: objects rendered with lighting, texturing, or undergo different processes, such as hidden surface removal, fog, and other states, which affect theappearance. • To turn on/offstates • glEnable ( GL_ LIGHTING ); glDisable ( GL_BLEND);

8. Basic StateManagement GL_BLEND (controls blending of RGBAvalues) GL_DEPTH_TEST (controls depth comparisons and updates to the depth buffer) GL_FOG (controlsfog) GL_LINE_STIPPLE (patternedlines) GL_LIGHTING (lighteffect) • void glEnable (GLenum capability); void glDisable (GLenum capability); • More than 60 enumerated values can be passed as parameters tothem. • E.g:

9. Basic StateManagement • To check whether a state is currently enabled or disabledby • GLboolean glIsEnabled (GLenumcapability) • Returns GL_TRUE or GL_FALSE, depending on whether or not it is currentlyactivated. • For more complicated state variables, such as glColor3f ( ) set three values, which are part ofthe GL_CURRENT_COLORstate. • Query routines: glGet* ();

10. Basic StateManagement • Five queryingroutines • void glGetBooleanv (GLenum pname, GLboolean *params); void glGetIntegerv (GLenum pname, GLint*params); • void glGetFloatv (GLenum pname, GLfloat*params); • void glGetDoublev (GLenum pname, GLdouble *params); void glGetPointerv (GLenum pname, GLvoid**params); • pname: a symbolic constant indicating the state variable to return; E.g.: GL_CURRENT_COLOR,GL_CURRENT_NORMAL • params: a pointer to an array of the returnedvalue. 10

11. Basic StateManagement • Example • To get the current RGBAcolor: • glGetIntegerv(GL_CURRENT_COLOR,params) or • glGetFloatv (GL_CURRENT_COLOR,params) • To get how many bits per pixel are available for each individual color component: • glGetIntegerv (GL_RED_BITS,redBitSize) • The possible values for pname can be referred to the tables in "OpenGL StateVariables“ in “The Red Book”. • http://fly.srk.fer.hr/~unreal/theredbook/appendixb.html (Releaseone)

12. Color and GrayScale • The basic attribute for all primitives iscolor. • In a color raster system, the number of colors available depends onthe • amount of storage per pixel in the framebuffer. • Two ways to store the colorinformation • RGB colorcode • directly stored in the framebuffer • E.g.: resolution - 1024X1024, a full-color (24-bit per pixel) color system 3 megabytes of storage for the framebuffer • Color index value (nextslide) • it references a color lookuptable

13. Color and GrayScale • Color index value(cont.) • Color code into a table (color lookup table or colormap) • To keep the index value referencing the color-table entries into each pixel location Only1megabyte for the frame buffer (size:1024X1024) Figure5-1

14. OpenGL&GLUT ColorFunctions • Color displaymode • RGB(RGBA)Mode:GLUT_RGB,GLUT_RGBA;GL_RGB,… • “A” is the alpha value for colorblending. • Color-Index Mode: GLUT_INDEX;GL_COLOR_INDEX • Set up for using thefunction • glutInitDisplayMode (GLUT_SINGLE |GLUT_RGB); • RGB (RGBA)mode • glColor*(colorComponents); • E.g.: glColor3f (0.0, 1.0,1.0); • glColor3fv(colorArray); glColor3i (0, 255,255);

15. OpenGL ColorFunctions • Color display mode(cont.) • Color-index mode glIndex*(colorIndex); • *:ub,s,i,d,orf • colorIndex is a non-negative integervalue. • the number of index in a color table is always a power of 2, such as 256 or1024. • E.g.: • //set the current color by the index in a color table glIndexi(196); • //to establish the color table glutSetColor (index, red, green,blue);

16. OpenGL ColorBlending • Methods for producing color-mixingeffects • (only performed in RGB or RGBAmode) • Blending effects are generated with the blending factors for destination object (the current object in the frame buffer) and source object (the incomingobject). • The new blended color is calculatedas • (factor)Source*(R,G,B,A)Source+ (factor)Des.*(R,G,B,A)Des. • (Sr*Rs + Dr*Rd, Sg*Gs + Dg*Gd, Sb*Bs + Db*Bd, Sa*As + Da*Ad) (5-1) (Rs, Gs, Bs,As) – Source Color • (Rd, Gd, Bd, Ad) – Destination Color (Sr, Sg, Sb, Sa) – Source blendingfactors • (Dr, Dg, Db, Da) – Destination blendingfactors

17. OpenGL ColorBlending • How to set up color blending inOpenGL • Firstly, to activate this feature glEnable(GL_BLEND); • glDisable(GL_BLEND); • Then, use thefunction • glBlendFunc (sFactor,dFactor); • sFactor(default:GL_ONE) [default:“replacing”] dFactor (default: GL_ZERO): • GL_ZERO -- (0.0, 0.0, 0.0,0.0), • GL_ONE -- (1.0, 1.0, 1.0,1.0)

18. OpenGL ColorBlending (From:OpenGLprogrammingguide,7thEd.)

19. OpenGL ColorBlending • Example: the drawn order effects the blendingresult • Alpha:0.75; • Source and destination blendingfactors: • GL_SRC_ ALPHA andGL_ONE_MINUS_SRC_ALPHA • 0.75*(source color) + (1.0-0.75)*(des.color) cyan one; yellowone. yellowone; cyanone. (From:OpenGLprogrammingguide,7thEd.)

20. Specifying Color inOpenGL • Don’t forget the OpenGL is a statemachine! • To define the shape of an object is independent of specifying itscolor. • Color is astate. • For example, thepseudocode • set_current_color(red); draw_object(A); draw_object(B); set_current_color(green); set_current_color(blue); draw_object(C); A B C

21. Specifying ShadingModel • A line or a filled polygon primitive can be drawn with a single color (flat shading) or with many different colors (smooth shading, also called Gouraudshading). • void glShadeModel (GLenummode); • mode: GL_SMOOTH(default) GL_FLAT

22. Specifying Color in OpenGLSummary • RGBA colorcomponents • glClearColor (r, g, b, a); glClear(GL_COLOR_BUFFER_BIT); • glColor* (r, g,b); • glutInitDisplayMode(GLUT_RGBA|…); //GLUT_RGB • Color indexmode • glClearIndex (index); ); glClear(GL_COLOR_BUFFER_BIT); • glIndex*(colorIndex); • glutInitDisplayMode(GLUT_INDEX |…); • Color blending – only for RGB/RGBAmode • glEnable(GL_BLEND); • glDisable(GL_BLEND); • glBlendFunc (sFactor,dFactor);

23. OpenGL Point-AttributeFunctions • Two basic attributes for points: Color andSize void glPointSize (GLfloatsize); size must be greater than 0.0 and by default is1.0. Query the point sizeby glGetFloatv(GL_POINT_SIZE). • Example: • glColor3f (1.0, 0.0, 0.0); glBegin(GL_POINTS); • glVertex2i (50,100); • glPointSize(2.0); • glColor3f (0.0, 1.0,0.0); • glVertex2i (75,150); • glPointSize(3.0); • glColor3f (0.0, 0.0,1.0); • glVertex2i (100,200); • glEnd(); The color and size are determined by currentvalues.

24. OpenGL Line-AttributeFunctions • Three basic attributes for lines: Color,Width, andStyle • OpenGL line-widthfunction • void glLineWidth (GLfloatwidth); • width must be greater than 0.0 and by default is1.0. A double-wide raster line with slope|m| < 1.0 generated with vertical pixelspans.

25. OpenGL Line-AttributeFunctions • OpenGL Line-Style Function (Stippledlines) Plotting three data sets with three different OpenGL line styles and line widths: single-width dash-dot pattern, double-widthdash pattern, and triple-width dotpattern

26. OpenGL Line-AttributeFunctions • How to set up OpenGL Line-StyleFunction • Activate the line-style feature by glEnable() glEnable (GL_LINE_STIPPLE); glDisable(GL_LINE_STIPPLE); • Define the current stipple pattern (a pattern of binarydigits) • glLineStipple (repeatFactor,pattern); • pattern:GLushort • The16-bit integer describing how the line should bedisplayed. • Abit“1:an“on”pixel position,andabit“0”:an“off”pixel position. • The default pattern is 0xFFFF (each bit has a value of 1) producing a solidline. • repeatFactor:GLint • Specifies how many times each bit in the pattern is to berepeated. • Value is clamped to be between 1 and 256. (default:1)

27. OpenGL Line-AttributeFunctions • Example

28. Chapter5. Attributes of GraphicsPrimitives PartII. Fill-area methods and attributes OpenGLfunctions

29. Fill-AreaAttributes • Fill Styles (Polygon -displayMode): • Hollowstyle • Only the boundary in Current Color(GL_LINE) • Solidfill Basic polygon fillstyles • Filled in Current Color including boundary (GL_FILL)(default) • Patternfill • Fill-Pattern (define a mask filled in CurrentColor) • Hatch fill (e.g., parallellines) • Texture (in Chapter10) • Areas filled with hatchpatterns. (From:MSDN,Microsoft)

30. OpenGL Fill-Area AttributeFunctions • In OpenGL, fill-area routines are ONLY for convexpolygons • Polygons • Filling within theboundary • solidlyfilled • stippled with a certainpattern • Outlinedpolygons • Points at thevertices • Four steps to generate pattern-filled convexpolygons: • Define a fillpattern; • Invoke the polygon-fill routine; ( glPolygonStipple()) • Activate the polygon-fill feature of OpenGL; ( glEnable()) • Describe the polygon to befilled.

31. OpenGL: Polygon Front andBack • Two sides of polygon: front andback • They can be rendereddifferently • By default, both front and back faces are drawn in the sameway • Control the drawing mode front and backfaces • void glPolygonMode (GLenum face, GLenummode); • face: GL_FRONT_AND_BACK, GL_FRONT, orGL_BACK; • mode: GL_POINT (drawn as points), GL_LINE (outlined), GL_FILL(filled, default)

32. Reversing and Culling PolygonFaces • Explicitly define the orientation of the front-facing polygon void glFrontFace (GLenummode); • mode: GL_CCW (in counterclockwiseorder) GL_CW ( in clockwiseorder) • To show the visible surfaces and discard the invisible ones void glCullFace (GLenummode); • mode: GL_FRONT, GL_BACK, orGL_FRONT_AND_BACK • To activate thisfeature • glEnable (GL_CULL_FACE); glDisable(GL_CULL_FACE);

33. OpenGL: Stipple-PatternFunction void glPolygonStipple (constGLubyte *mask); mask: a pointer to a 32 × 32 bitmap that’s interpreted as a mask of 0s and1s. glEnable (GL_POLYGON_STIPPLE); glDisable (GL_POLYGON_STIPPLE);

34. OpenGL: Stipple-PatternFunction Example

35. OpenGL: Polygon SolidColor • Polygon filled with solid colors: GL_SMOOTH(default) an interpolation of the vertexcolors • E.g., Each of the three vertices is assigned different color. The polygon is to be filled as a linear interpolation of the verticescolors. ns (Chapter10) OpenGL TexturePatter 

36. OpenGL: Polygon WireframeMethods • Example: Display a polygon with both an interiorfill and a different color or pattern for its edges (or vertices). • glColor3f (0.0, 1.0,0.0); • /* Invoke polygon-generating routine.*/ • // by default,GL_FILL • glColor3f (1.0, 0.0,0.0); • glPolygonMode (GL_FRONT,GL_LINE); • /* Invoke polygon-generating routine again.*/

37. OpenGL: Polygon WireframeMethods • Show concavepolygons • A concave polygon is separated into a set of convex polygons to be rendered byOpenGL. • In a wire-frame form, the interior edges areshown. • To eliminate some edges, set edges bit flags to “off”. void glEdgeFlag (GLbooleanflag); • void glEdgeFlagv (const GLboolean*flag); • flag: GL_TRUE (default);GL_FALSE • It is used between glBegin() and glEnd()pairs. • It applies to all subsequently specified vertices until the next glEdgeFlag() call ismade.

38. OpenGL: Polygon WireframeMethods • Example: Display only two edges of the definetriangle • glPolygonMode (GL_FRONT_AND_BACK, GL_LINE); glBegin(GL_POLYGON); • glVertex3fv (v1); glEdgeFlag(GL_FALSE); • glVertex3fv (v2); //the edge from v2 will not be d splayed glEdgeFlag(GL_TRUE); • glVertex3fv(v3); • glEnd(); • ------------------------------------------------------------------------- • To specify the polygon edge flags in anarray: • glEnableClientState (GL_EDGE_FLAG_ARRAY); glEdgeFlagPointer (offset,edgeFlagArray); • offset: the number of bytes between the values for the edge flags in edgeFlagArray; default:0. i

39. OpenGL Primitives andAttributes Nate Robins Tutorial:http://www.xmission.com/~nate/tutors.html

40. Fill-AreaMethods • Two basic methods for filling an area on rastersystems • Scan-Conversion • Determine the overlap intervals for scan lines crossing the area, and set the pixel positions along these overlap intervals to the fillcolor. • Boundary-Fill/Flood-Fill • Start from a given interior position and “paint” outward,pixel by-pixel, until it gets to theboundary. • Good for arbitrary shape ofboundary. 40

41. Fill-Area Method on RasterSystems • Scan-Conversion • Determining the intersection positions of the boundaries of the fill region with thescreen • scanlines; • To apply the fill color to each section of a scanline that lies in the interior of the fillregion. Scan-conversion to a fill-area (ABCDEFGHI-JKL) with the line segments produced at the scan lines: A-B:[A,B] A1-B1:[A1,L1],[K1,B1] A2-B2:[A2,L2],[K2,E1],[C1,B2] Odd-evenrule: odd – interior; even –exterior.

42. Chapter5. Attributes of GraphicsPrimitives PartIII. Character attributes and OpenGLfunctions

43. Outline • OpenGL Character-AttributesFunctions • OpenGL AttributeGroups

44. CharacterAttributes The appearance of displayed characters is controlled by attributes such as font, size, color, andorientation. Examples of characterbodies. Character size (height) is specified by printers in points, where 1 point = 0.035146centimeters.

45. Examples of StringsSizes • The size of textstrings FIGURE5-12 Different character- height settings witha constant width-to- heightratio. FIGURE5-13 Varying sizes ofthe character widths and afixed height. FIGURE5-14 Text strings displayed with different character-spacing values.

46. CharacterAttributes • Set the orientation according to the direction of a character upvector • FIGURE 5-18 Direction of the up vector at 45o (a); controls the orientation of the displayed text(b). • Set text-path up (vertically) and down (horizontally); left (forward) andright FIGURE 5-19 A text stringdisplayed with the four text-path options: left, right, up, anddown. (backward).

47. CharacterAttributes • The alignments of a characterstring • How text is to be displayed with respect to a referenceposition. FIGURE 5-20 Typical character alignments for horizontal and verticalstrings.

48. OpenGL Character-Attributes Functions • Two methods for displaying characters inOpenGL • Design a font set using the bitmap functions in the OpenGL corelibrary. • glBitmap (w,h,x0,y0,xShift,yShift,pattern); [in4-11] • Invoke the GLUT character-generationroutines. • GLUT library contains functions for displayingpredefined bitmap and stroke charactersets. • glutBitmapCharacter(font,char); [in4-13] glutStrokeCharacter(font,char);

49. Bitmap Function inOpenGL • Example: draws the character F three times on thescreen Shows the F as a bitmap and its corresponding bitmapdata. Note: the visible part of the F character is at most 10 bits wide. Bitmap data is always stored in chunks that are multiples of 8 bits, but the width of the actual bitmap doesn't have to be a multiple of8.

50. Bitmap Function inOpenGL • Sets the current raster position: the current raster position is the origin where the next bitmap (or image) is to bedrawn. • Use the glBitmap() command to draw thedata. A Bitmap and Its AssociatedParameters 50