3.

Colour Representation and OpenGL State

Lecture Plan
1. Introduction to Display Hardware

2. Colour Models
3. Representing and Using Colour in OpenGL 4. Controlling OpenGL with State Variables

1. Introduction to Display Hardware

1. Introduction to Display Hardware

Display Standards
IBM Introduce CGA (Colour Graphics Adapter) 4 colours @ 300x200 EGA (Enhanced Graphics Adapter) 16 colours @640x350 VGA (Video Graphics Adapter) 16 & 256 colour modes @640x480 XGA (Extended Graphics Adapter) Millions of Colours @800x600 or Thousands of colours at @1024x768 UXGA (Ultra Extended Graphics Array) Millions of Colours @1600x1200 QXGA (Quad Extended Graphics Array) Millions of Colours @2048x1536 Widescreen standards

WUXGA @1920x1200 WQXGA @2560x1600

VGA is an analogue standard. DVI (Digital Video Interface) provides a digital solution for newer digital monitors
4

1. Introduction to Display Hardware

DVI Digital Video Interface

Standard created by the Digital Display Working Group (DDWG) to accommodate analogue and digital display signals 3 variations of the interface exist

DVI-A: Carry analogue only signals DVI-D: Carry digital signals DVI-I: Integrated version carry both analogue and digital signals
Additional ports - Dual-Link DVI (support resolutions 2560 x 1600) - Mini-DisplayPort (VGA and Dual-Link DVI compatible) but 2/3 size of USB
5

1. Introduction to Display Hardware

Older monitor technology was based on Cathode Ray Tube technology used in television sets. Here the image was created by an electron gun firing beams of electrons representing the red, green and blue colours.

Magnetic plates direct the electron beams

The final display is generated

Electrons are fired through the vacuum tube

Video Signal Heat generated to release electrons

Focusing mechanism forces electrons forwards

1. Introduction to Display Hardware

Passive Matrix LCDs

Pixels are arranged on a grid of horizontal and vertical wires Advantage - Simple Architecture

Pixels are activated by sending signals along the appropriate horizontal and vertical wires

Disadvantages - Slow response time (moving the mouse leaves a ghost trail) Also, pixels being updated effect its neighbours leaving a fuzzy image

1. Introduction to Display Hardware

Active Matrix LCDs
Active Matrix displays depend on Thin Film Transistors (TFTs)

Each transistor lies on a grid of wires and allows precise control over the voltage that can be passed through, allowing us to create a grey scale image (today around 256 levels)

To create a colour image, three sets of TFTs are required one for red, one for green and one for blue colour.
-TFT displays overcome the problems of passive matrix displays but can suffer from Dead Pixels eg. transistors always on or off. -Historically problems with colour reproduction and brightness existed, but less so today. -Response time & view angle important issues.
8

2. Colour Models

2. Colour Models

Chromaticity Diagram - Human Visibility

y 0.8 0.7 0.6 0.5 0.4 0.3 0.2 0.1 0.0 0.0 0.1 0.2 0.3 0.4 0.5 0.6 0.7 x

This represents all colours perceivable to the human eye.

The represents the different wavelengths of light mapped to an xyY domain.

390nm = Blue 520nm = Green 720nm = Red

10

2. Colour Models
RGB Colour - Visible Gamut
Computer monitors are only capable of generating certain frequencies within the chromaticity space. As such colour models used in computer graphics do not cover the range of colours perceivable by humans.

y 0.8 0.7 0.6 0.5 0.4 0.3 0.2 0.1 0.0 0.0 0.1 0.2 0.3 0.4 0.5 0.6 0.7 x

11

2. Colour Models
RGB Colour Model
Colours in the visible spectrum can be created from combinations of the three primary colours Red Green Blue This is the primary colour model in computer graphics and OpenGL. RGB is an additive model ie. we combine colours to create new ones

12

2. Colour Models
CMYK Colour Model
CMYK = (Cyan, Mgenta, Yellow, Key i.e. Black)

This is a subtractive colour model and used in printing devices

Derived from the model artists used for centuries where the primary colours were Red, Yellow and Blue.

There are many other colour models CcMmYK 6 colour model used in inkjet printers Hexachrome (CMYKOG where Orange and Green are added)

13

3. Representing and Using Colour in OpenGL

14

3. Representing and Using Colour in OpenGL

Direct Colour Model
Each pixel is represented by 4 components RGBA The RGB stands for the three primary colours (Red, Green, Blue). A represents the alpha channel. This controls transparency. Each pixel is represented by 4 bytes (32 bits), 1 byte per RGBA component

Pixel

Red

Green

Blue

Alpha

24 pixels correspond to the colour which means we can represent 16,777,216 colours!!!
15

3. Representing and Using Colour in OpenGL

Colour Indexing
Instead of representing the colour of each pixel directly, each pixel simply stores an index to a colour table. The actual RGB values are then obtained from this table.

Image
0 0 31 0 2 2 1 2 2 8 1 31 31 8

Colour Lookup Table Index 0 1 2 254 255 RGB 0,0,0 2,2,2 0,1,1 56,3,2 81,4,76

31 31

This means images are more compact, but the OpenGL ARB recommend using direct mode for more predictable results.
16

3. Representing and Using Colour in OpenGL

Choosing a Colour Model in OpenGL
We must specify the type of colour model we want to use when the Pixel Format Descriptor is defined To use the RGBA direct colour model we must set the iPixelType flag of the Pixel Format Descriptor to PFD_TYPE_RGBA

To use the colour indexing model we must set the iPixelType flag of the Pixel Format Descriptor to PFD_TYPE_COLORINDEX

Note: For the remainder of this course well be using the RGBA direct colour model.

17

3. Representing and Using Colour in OpenGL

Specifying Colours in OpenGL

Colours can be set on a per-vertex basis. To set the current colour in OpenGL use the glColor() command. Like the glVertex() commands, there are different versions depending on the type of data youre working with

glColor3f(1.0, 0.0, 0.0); - specify RGB as floating point numbers in the range [0, 1].
glColor3ub(255, 0, 0); - specify RGB as unsigned byte values in the range [0, 255].

18

4. Controlling OpenGL with State Variables

19

4. Controlling OpenGL with State Variables

Colour is an example of a state variable in OpenGL. Once you set the colour everything you draw will use that colour until you change it with another call to glColor().

OpenGL is an example of a state-based rendering API. The internal state (stored in the rendering context) affects how the shapes / geometry are rendered on-screen.
OpenGLs state is a collection of variable and flags that describe all aspects of the rendering pipeline. For example

Control the colour and transparency (as described above) Control the position of objects and camera in a scene How a 3D environment is mapped into a 2D window Which textures are to be used Switch on and off different features (depth testing for example)

20

4. Controlling OpenGL with State Variables

Examples of controlling OpenGL state

Set the point size to control the size of points when rendering in GL_POINTS mode glPointSize( 2.0 );
Set the width of lines when using GL_LINES or GL_LINE_LOOP for example glLineWidth( 5.0 ); Set the pattern for lines (dotted lines, dashed lines etc.) glLineStipple( 1.0, 0xF0F0 ); The above sets the pattern of the line, but for this to be applied to lines drawn in OpenGL we need to turn the line stipple feature on. This is done with the glEnable function glEnable(GL_LINE_STIPPLE); To turn off the line stipple feature we use the glDisable function glDisable(GL_LINE_STIPPLE);
21

4. Controlling OpenGL with State Variables

Examples of controlling OpenGL state

In the examples considered so far weve been rendering objects with (x, y) coordinates between -1 and +1. This is because the viewplane has been set to these extents. The viewplane size is just another state variable in OpenGL and this can be changed using the glOrtho function (for 2D graphics well look at 3D later in the course). The default in the tutorial example file main.cpp is glOrtho( -1.0, 1.0, -1.0, 1.0, -1.0, 1.0 );

To give ourselves a bigger canvas we can change this to glOrtho( -10.0, 10.0, -10.0, 10.0, -1.0, 1.0 );
Now all our coordinates between -10 and +10 will be visible.

22

4. Controlling OpenGL with State Variables

Examples of controlling OpenGL state

When we draw triangles or polygons by default they are filled in. But how they are drawn and filled in is controlled by OpenGL state variables To force OpenGL to render all polygons with lines (instead of filling in) use glPolygonMode(GL_FRONT, GL_LINE); This is useful for drawing an outline (wireframe) version of the model.

To get OpenGL to draw filled in polygons again use glPolygonMode(GL_FRONT, GL_FILL);

23

4. Controlling OpenGL with State Variables

Examples of controlling OpenGL state

When triangles and polygons are filled in, OpenGL controls how they are filled in with the shade model state variable. This can take one of two values

To use flat shading (where the entire polygon is coloured using only the last colour specified with glColor) use glShadeModel(GL_FLAT);

This is the default setting.

To enable smooth shading, where every pixel in the polygon is a weighted average of all the polygons vertex colours use glShadeModel(GL_SMOOTH);

This uses Gouraud shading to fill in the polygon.

4. Controlling OpenGL with State Variables

The pros and cons of OpenGLs state model A large number of state variables belong to the fixed function rendering model. Though they are convenient for many applications, they are not sufficient for all cases. With the programmable pipeline (that uses shaders) we can define our own state variables and therefore have much more control over the rendering process. When rendering complex scenes with many objects, changing OpenGLs rendering state is unavoidable as objects will need to be rendered with different properties. This becomes a problem because state changes incur a performance overhead. For real-time applications is needs to be minimised. To do this, all objects that are rendered with one configuration are batched together so the state variables only have to be set once for those objects.