Computer Graphics Origins

William Fetter, Boeing engineer, 1960

Computer Graphics Definitions

1) Use of a computer to generate images 2) Image synthesis by computer 3) Producing of images using computational techniques

Frame Buffer

Special memory, sometimes part of main memory, sometimes not -> Restores a map with its record of everything on the screen

Picture Elements

Lights on the screen that can be on or off

Raster Display

Display of pixels on the screen

Fundamental task of Computer Graphics

Turn pixels on and off

Rasterizing

Lighting a pixel

α

{2, 3, 4} -> number of dimensions

β

{i, f, d, ub} -> 32-bit integer, single precision 32-bit float, double precision 64-bit double, unsigned byte (8 bit or 2 bytes)

γ (gamma)

{v} -> Vector (array or tuple)

How to set the pen/pixel color?

glColor3f(float r, float g, float b)

What happens if your rgb # is < 1, or > 1?

The value clamps to 0 or 1

Scene

Consists of the things that get drawn on the screen and the area they exist on the screen

Objects

In the scene, anything that gets rendered in the scene

Viewing Region

Limits of the scene

Viewing Plane

Abstract quantity. What the viewing region is projected upon and how it appears (NOT THE SCREEN. Objects may be a different size than in the region)

What rule or system does the camera of OpenGL use?

The right-hand rule or a counterclockwise system

glOrtho(left, right, bottom, top, near-distance, far-distance) function

Defines the boundary of the viewing region, tells gl to view the photo orthographically, only defines a shape

Primitives

Elements of drawing an object

glVertex3i(int x, int y, int z)

Location in a space world with respect to my camera. Objects by default have -Z coordinates

How do you define a points function?

glBegin(GL_POINTS)

How do you define a lines function?

glBegin(GL_LINES) - If there is an odd number of vertices, it discards the last vertex

How do you define a Triangles function?

glBegin(GL_TRIANGLES)

How do you define a Polygon function?

glBegin(GL_POLYGON) - Closes the polygon for the programmer - Doesn't have to be convex

How do draw a set of lines?

- GL_LINE_LOOP (Doesn't make you repeat and draws a line between successive vertices and connects the last line to the first one at the end without asking it to) - GL_LINE_STRIP (Doesn't make you repeat and draws a line between successive vertices)

How do draw a set of triangles?

- GL_TRIANGLE_STRIP - GL_TRIANGLE_FAN (makes like a pyramid)

OpenGL States

- Pen Color - Viewing Model - Light Properties - Pen/Point Width - Fill Pattern - Background Color

How to change the background color?

glClearColor(r, g, b, α) - alpha is the opacity of the background (0 = transparent, 1 = opaque)

How do I clear the screen?

glClear(GL_COLOR_BUFFER_BIT)

What is glutMainLoop?

Built in glut command that is used by the programmer to turn over the execution of the code to gluT

What does glutMainLoop do each iteration?

- Listens/Looks for an event - Dispatches handler => Callback

What function generates the display event?

glutInit()

What must you register for the display event to occur?

glutDisplayFunc(name of the display function)

What is a keyboard event?

Each key press is a separate event, Designed to capture A-Z and ome special keys

What is the glut function for a keyboard event?

glutKeyboardFunc(name of the keyboard function) -> to be placed in the main function

What is the form of the registered keyboard function?

void function(char val [key inputted by the user], int x, int y [ location of the cursor when the input occurred])

Mouse Event

A click or release of the mouse

What is the glut function for a mouse event?

glutMouseFunction(name of the mouse function) -> to be placed in the main function

What is the form of the registered mouse function?

void Function (int button [button the user presses], int state [push or release of a button], int x, int y [location of the cursor when input occurred])

What are the button values for the mouse?

- GLUT_LEFT_BUTTON - GLUT_RIGHT_BUTTON - GLUT_MIDDLE_BUTTON

What are the button state values?

- GLUT_UP -> Release Event - GLUT_DOWN -> Press Event

Vector Graphics vs Raster Graphics

"Vector graphics store shapes as mathematical primitives and scale infinitely without losing quality while raster graphics store shapes as a discrete 2D grid of pixels that pixelate when scaled"

Raster Library Minimum Requirements

"Framebuffer memory allocation plus direct pixel read or write operations and basic primitive scan conversion along with mapping screen coordinates"

OpenGL Design Philosophy Limitations

"Designed purely as a cross platform rendering engine so it deliberately excludes windowing and user input handling and sound and scene graph management"

Stroke-Based Font Memory Cost

"Constant memory cost relative to font size because glyphs are defined mathematically as vector paths and re used for all point sizes"

Bitmap Font Memory Cost

"Quadratic memory cost relative to size because each point size requires a unique pixel grid to prevent extreme scaling distortion"

Hersch Character Generation Issues

"Low resolution rasterization causes stem thickening and serif dropouts due to uneven pixel grid snapping which is solved using grid fitting hints"

Vector Cross Product Rule

"For vectors u and v the cross product w equals u x v which yields a vector perpendicular to both u and v"

Vector Dot Product Distributive Property

"The dot product of u with the sum of v and w equals the dot product of u and v plus the dot product of u and w because scalar multiplication distributes over addition for each vector component"

Scaling vs Translation Difference

"Scaling multiplies vertices by factor k to expand or contract an object volume while translation adds offset k to shift location without changing size"

Architecture Haiku Page Limit

"Restricted to one page to enforce conciseness and maintain a high signal to noise ratio while highlighting core design decisions immediately"

Danger of Loops in GLUT

"Standard loops block the main event handling thread which prevents window repaints and input collection and freezes the user interface"

Idle Handler Animation

"An execution model where updates occur continuously during unused CPU cycles which makes animation speed dependent on processor performance"

Timer Handler Animation

"An execution model where updates are triggered at fixed time intervals such as every 16ms to ensure consistent animation frame rates across machines"

Orthographic vs Perspective Projection

"Orthographic preserves parallel lines and exact dimensions without foreshortening while perspective simulates eye depth by scaling objects down with distance"

OpenGL Display Lists

"Pre compiled sequences of OpenGL commands cached in GPU memory to reduce CPU to GPU transfer bottlenecks during repeated renders"

Legacy Matrix Transformations

"Stack based commands like glTranslatef and glRotatef and glScalef that modify state matrices and must be declared in reverse order of intended application"

Line Primitive Rasterization Challenge

"Scan converting continuous linear equations onto discrete pixel grids efficiently using integer math while handling anti aliasing and clipping"

Stroke-Based Scaling Pseudocode

"Loop through each path vertex in a stroke glyph and multiply both x and y coordinates by target scale factors"

Point-Based Typography Challenge

"Maintaining pixel density during scaling so that gaps do not appear between individual points as characters expand"

Idle Event

When there is nothing going on; Pseudo-event; Helpful for frame based animation

glutPostRedisplay()

Tells the OS, you the programmer wants to add an event to the queue

Cludge

An inelegant solution

Timer Event

glutTimerFunc(Time mssec_time -> time in milliseconds the event will occur after, void frame, int id -> value passed to the function) - Sets a timer once that doesn't repeat

Mouse Moves handler -> Active Motion

- Mouse button is pressed, while that button is pressed, movement occurs - glutMotionFunc(frame) - Tends to generate events upon a change in speed or direction

Mouse Moves handler -> Passive Motion

- glutPassiveMotionFunc(frame) - Higher load handler, register and deregister if you must you it

Mouse Moves handler -> Passive Motion prototype

Prototype(int x, int y) -> x,y supplied by the OS and is the location of the cursor when the event occurs

Special Keys Handler and prototype

- Function's key input (F1 - F12, etc) - glutSpecialFunc(frame) - void frame(char key, int x, int y)

WindowResize handler and prototype

- glutReshapeFunc(frame) - void frame(int width, int height) -> new width and height supplied by the OS

Reminders for how events work

1. Events are handled in order 2. Events are not interrupted 3. Event handlers should be fast, as a result

Computer Graphics System Origins

- MIT Whirlwind I Computer -> First Computer with a Display whose purpose was to try and be a flight simulator

How Vector Graphics worked initially

Tend to flicker a phosphor continually hit with electrons the more complex a scene is

Sketchpad

Ivan Sutherland created it in 1962/1963 - First graphical user interface in computing - consisted of data structures for computer graphics - Precursor to OOP

Vector Graphics Algorithm

A sequence of steps to accomplish a computer graphics task taking place on a vector graphics display

Raster Graphics

Started in 1973 - Less Flexible hardware than vector graphics, but more flexible in the eyes of the programmer

Raster

Row of pixels (horizontal)

Raster Scan

Screen is drawn row by row

Xerox Alto

- 1973 - 1st PC - 1st Commercial Mouse - Raster Display - 600 x 800 frame buffer (1st time one was commercially demonstrated) - Created by William Newman

Graphics Libraries: Graphics Kernel System (GKS)

- 1985 - 2D - ANSI/ISO - First Standardized Graphics Library

Graphics Libraries: PHIGS (Programmers Hierarchical Interactive Graphics System)

- 1988 - 3D - ANSI - Supported Hierarchical Modeling

OpenGL

- SGI released it in 1992 - 3D - Not standardized - OpenGL was marketing to be licensed and work on a PHIGS device and still works when changed to SGI

glFlush()

- Fixes buffer error when nothing is being drawn - Polite request to the OS to empty out the buffer - Sometimes still ignored -> then use glFinish()

Architecture Statement Goals

- Concise (<1 page) - Well-orients to CODE - Describes Solution -> Methodology -> Code Organization -> Mechanisms -> Code Interactions - Goal is not to tell the user how to use OpenGL

Character Generation Representation: Stroke Representation

Representing something as a series of lines that make it up -> Find the pixels the line overlaps and turn them on (Scan Conversion) - glStrokeCharacter(int fontname, char character) - Always output at the origin - font name example: GLUT_STROKE_ROMAN

Elements of Analysis

- Computation Speed - Memory Usage - Realism/Accuracy (tradeoff with memory)

Character Generation Representation: Bitmap Representation

Matrix of bits, 2D array - Representation: 0 bit = no lighting, 1 bit = lighting - glutBitmapCharacter(int fontname, char character) - Example of fontnames GLUT_BITMAP_TIMES_ROMAN_10 or GLUT_BITMAP_8_BY_13

Analysis of Bitmap Representation

- Faster of the two - Fixed storage size but we need one bit map per font size - Accuracy depends on the size, # of strokes, and the more real, the higher cost

Is OpenGL device dependent?

OpenGL is device independent to a fault, pixels are device dependent

Things you need for a Display List

1. Allocate Space: int glGenLists(int number -> # of lists) -> if multiple are created the first id is returned then the subsequent ones are +1 2. Open the buffer glNewList(int id, int state) 3. "Close the Buffer" glEndList() - commands between open and close of the buffer are stored in the frame 4. Instantiating/Realizing the Display List: glCallList(int id)

Display List things to note

- not pass by value or reference since it has no parameters - Built at runtime - Benefit: opportunity for performance improvements

Sphere commands in glut

glutWireSphere glutSolidSphere

Cube commands in glut

glutWireCube glutSolidCube

Octahedron commands in glut

glutWireOctahedron glutSolidOctahedron

How do you translate an object in OpenGL and change its position state?

glTranslatef(float x, float y, float z) - Cumulative - Tells how much to offset future states

What does glLoadIdentity() do?

Clears the position state

How do you rotate an object in OpenGL and change its orientation state?

glRotatef(degrees, rx, ry, rz) -> where rx, ry, rz is the vector around which to rotate according to the right hand rule

How do you scale an object in OpenGL?

glScalef(sx, sy, sz)

Which order do you do the state commands?

glTranslate() glRotate() glScale()

Geometric formula for dot product of vectors

a*b = |a||b|*cos(theta)

Geometric formula for cross product of vectors

a X b = |a||b|*sin(theta)*u - u is the unit vector directed according to the right hand rule

How many clock cycles does it take to find a point on a screen?

2 Clock Cycles (CCs)