Adigrat University

Department of Software Engineering

Computer Graphics
Chapter -1
Introduction to Computer Graphics

Source: Computer Graphics with OpenGL,

Donald Hearn and M. Pauline Baker,
Prentice-Hall, 2004 (Third Edition)

Compiled by Bekele A. Nov 2018

Contents
 Definition of Computer Graphics

 Application Areas of Computer Graphics

 Graphics Display Devices

 Graphics Input Devices

 Graphics Software

 Introduction to OpenGL

2
Introduction
 What is Computer Graphics?
 It is a sub-field of CS which studies methods for digitally
synthesizing and manipulating visual content.
 It focuses on the mathematical and computational
foundations of image generation and processing rather
than purely artistic issues.
 It describes the use of computer to create images or
videos.
 We can define computer graphics as the algorithms and
hardware required to produce realistic and useful
images on a computer.

3
 Application Areas of Computer Graphics
Computer Graphics have very important role in many aspects of our
daily life.
The following sections summarise the main categories of application.
 Graphs and Charts : Graphs and charts have long been used for
visualising data relationships and trends in scientific, mathematical,
financial and economic data.

Figure 2 - Computer Graphics used for Graphs and Charts

4
 … Cont’d

 Computer-Aided Design: Computer-Aided Design (CAD) and

Computer-Aided Drafting and Design (CADD) involve using a
computer application enable designers to construct and visualise
3-D models. They are commonly used in fields such as
architecture, engineering and circuit design.

Figure 3 shows screenshots from CAD applications

5
 … cont’d
 design of buildings, automobiles, aircraft, watercraft,
spacecraft, computers, textiles, …

Multiple window, color coded CAD Color coded wireframe display of

workstation displays body designs for an aircraft
6
 …cont’d
 Architects also use it to lay out floor plan and design
different building features.
 With virtual reality systems designers can even go for a
simulation walk through the rooms.

Realistic, 3D rendering of
building designs

7
 …Cont’d
 Data Visualisation : More complex, often multidimensional,
datasets can also be visualised using graphics techniques.
 To visualize and analyse large amount of information for scientists,
engineers, medical personels, business analysts, ...
 Techniques: color coding, contour plots, graphs and charts, surface
rendering, visualizations of volume interiors, ...

8
 …Cont’d
 Virtual Reality and Augmented Reality :
Virtual Reality (VR) allows users to be immersed in a
computer generated world, and to interact with it as if they
were interacting with the real world. Typically, the user will
wear special hardware such as the VR-headset shown in
Figure .

9
 …Cont’d
Augmented Reality (AR) combines a computer-generated
virtual world with the real world. In AR, computer-generated
images are overlaid onto a user’s view of the real world.

10
 …Cont’d
 Education and Training
 Graphics are used to help the human visualization in different
education and training areas such as in human anatomy, truck-
driving simulation, helicopter simulation, laser eye surgery
simulation and etc.

11
 …Cont’d
 Graphical User Interfaces: Another possibility that has been
opened up by the improvements in computer graphics
technology is in the area of user interfaces.

CLI GUI

12
 …Cont’d
 Entertainment : The applications of computer graphics in
entertainment fall into three categories: computer art,
special effects and animations, and games.

Figure shows a frame from an Figure shows a frame from the film
animated artwork by William Latham Final Fantasy

13
 …Cont’d

Figure show screenshots from the popular computer game Doom.

14
Graphics Display Devices

 Any computer-generated image must be displayed in

some form.
 Common graphics displays
 Cathode Ray Tube (CRT)
 Liquid Crystal Display (LCD)
 The most common of the primary graphics display device
is the video monitor, and the most common technology
for video monitors is the Cathode Ray Tube (CRT).
 most old television sets use CRT technology

15
Cathode Ray Tube (CRT)
 Electron guns generate electron beam
 Electron bemas fired towards the screen
 Beam hits the phosphor dots
 Phosphor dots emits light
 Brightness = strength of the beam

A Cathode Ray Tube Display Device

16
 ....CRT
 The beam passes through the magnetic field (deflection yoke)
to control their directions
 3 electron beams and group of 3 phosphor dots = color
 Brightness of the RGB dots and their combination = color of
light perceived at that point
 CRT displays can work in one of two ways
 Random scan devices or
 Raster scan devices

17
Random scan devices
 In random scan device, the CRT beam is only directed
to areas of the screen where parts of the picture are to
be drawn.
 If a part of the screen is blank the electron beam will
never be directed at it.
 In this case, we draw a picture as a set of primitives, for
example lines or curves.
 For this reason, random scan devices are also known as
vector graphics displays.
 Only used in hardcopy plotters

18
Raster Scan Devices

Raster Scan Terminology

 Raster: a grid of phosphor dots on the display screen

 Pixel or picture cell: each phosphor dots
 Scan-line: row of pixels in the raster
 X-Resolution: number of pixels in the x scan-line
 Y-Resolution: number of the y scan-lines in the raster
 Aspect Ratio of the display: the ratio between X-Resolution and Y-
Resolution

19
Raster Scan Devices
 Primitives to be drawn converted in to a grid of dots
 Brightness of these dots stored in a frame buffer
 CRT beem sweeps across the screen line by line
 It visits every location on the screen
 Frame buffer controls the place where the CRT electron beem
switched on
 Most common types of graphics displays

20
Raster Scan Devices
 Raster scan-line by scan-line, starting from the top and
working towards the bottom.
 The number of times that the entire raster is refreshed
(i.e. drawn) each second is known as the refresh rate of
the device.
 Early graphics systems tended to have refresh rates of
about 30 f/s, consequently, some flicker was
noticeable
 Modern graphics displays have high refresh rates, typically
in the region of 60 f/s

21
Interlaced scanning
 To overcome this, a technique known as interlaced
scanning was employed.
 Using interlaced scanning alternate scan-lines are updated
in each raster refresh.
 For example, in the first refresh only odd numbered scan-
lines then even scan lines
 It effectively doubles the screen refresh rate
 It has the effect of reducing flicker for displays with low
refresh rates

22
Raster Vs Vector display

Random Scan Vs Raster Scan CRT Displays

23
Architecture of Raster Graphics Systems

Block-diagram of a typical raster graphics system

24
3-D Display Devices
 The aim of 3-D display devices is to provide a stereo pair of
images, one to each eye of the viewer, so that the viewer can
perceive the depth of objects in the scene as well as their
position.
 The process of generating such 3-D displays is known as
stereoscopy.
 3-D displays can be divided into two types
 Head-Mounted Displays (HMDs) and
 Head-Tracked Displays (HTDs).

25
 … cont’d
 HMDs
 Are displays that are mounted on the head of the
viewer.
 The device fits on the head of the user and displays
separate images to the left and right eyes, producing a
sense of stereo immersion.
 Such devices are common in virtual reality
applications.
 The display moves with the viewers head,

26
 …Cont’d
 HTD
 HTD the display remains stationary, but the head of the
viewer is tracked so that the images presented in the display
can be updated.
 The difficulty with HTDs is how to ensure that the left and
right eyes of the viewer receive separate stereo images to
give a 3-D depth effect.
 Polarized light filters
 Color filters
Graphics Input Device

Key board
Mouse
Light pens

Trackballs Joysticks
Tablet

Data Gloves
28
 … cont’d
 Data glove
 A data glove is an interactive device, like a glove worn on
the hand, which facilitates tactile sensing and fine-motion
control in robotics and virtual reality .
 Tactile sensing involves simulation of the sense of
human touch and includes the ability to perceive pressure,
linear force, torque, temperature, and surface texture.
 Fine-motion control involves the use of sensors to
detect the movements of the user's hand and fingers, and
the translation of these motions into signals that can be
used by a virtual hand (for example, in gaming ) or a
robotic hand (for example, in remote-control surgery).
29
 Graphics Software
 We can divide graphics software into two categories:
 Special-purpose graphics packages
 General-purpose graphics packages

 Special-purpose graphics packages

 Tend to be used mostly by end-users, not programmers
or computer professionals.
 No need to know about computer graphics theory to
use them.

30
 … cont’d
 Examples of Special-purpose graphics packages
 Paint accessory in Microsoft Windows: allow users to draw
simple pictures (lines, curves and other basic components).
 CAD packages : these are designed to allow users to build and
visualise 3-D models.
 Drawing applications such as Adobe Photoshop, Xara , GIMP &
etc.
 3-D modelling applications 3-D Studio Max, Design Works & etc.
 Visualisation software Fusion Charts and Microsoft Excel.

31
General purpose packages
 Has pre-defined library of routines for drawing graphics
primitives.
 They are used by computer programmers to add graphical
capability to their programs.
 They provide more flexibility than special-purpose packages but
they require technical knowledge of computer graphics and
programming and so are not suitable for end-users.
 Examples of general-purpose graphics packages
 The standard low-level graphics library OpenGL,
 Scene discription languages (to define 3D models of scenes like VRML:
virtual reality modeling language)
 The Microsoft equivalent DirectX and
 The higher-level library OpenInventor.

32
OpenGL
 OpenGL is based on the GL graphics package developed
by the graphics hardware manufacturer Silicon Graphics.
 GL was a popular package but it was specific to Silicon
Graphics systems, i.e. code written using GL would only
run on Silicon Graphics hardware.
 In an attempt to overcome this limitation, OpenGL was
developed in the early 1990’s as a free platform-
independent version of GL.

33
 OpenGL Libraries
 OpenGL is core library that contains the majority of the
functionality.
 Four important libraries:
 OpenGL: the core library, it is platform independent,
 glut: GL Utilities Toolkit,
 it contains some extra routines for drawing 3-D objects and other
primitives.
 glu: OpenGL Utilities,
 it contains some extra routines for projections and rendering
complex 3-D objects.
 glui: Contains some extra routines for creating user-
interfaces.
 Getting Started with OpenGL (@lab…)
34
35