1

Graphics

CSCI 343, Fall 2015Lecture 1

Introduction to GraphicsRead: Chapter 1 of textbook

2

Computer Graphics

This course is about the theory underlying computer graphics:ProjectionLightingTransformationShadingetc.

This course is not about using applications (e.g. Photoshop)

We will use WebGL to implement and learn the theory.The course is not about WebGL.At the end of the course you should be able to write your own WebGL functions.

3

Administrivia

Most of the information about the course may be found at the course website:

http://mathcs.holycross.edu/~csci343

This site contains the course information, course schedule, assignments, lecture notes and some links to other helpful sites.

4

Demos

At the end of the course you will write a short animation program:

Bobo

Canon

Solar System

5

Uses of Computer Graphics

We will discuss this in class

6

Graphics Systems

Monitor (pixelated image)

A frame buffer stores the value for each pixel in the display.

The bit depth is the number of bits used to specify the color of each pixel. 8 bits => 256 colors.

Input (Keyboard or mouse)

Central Processor (computer)

Frame Buffer (VRAM or DRAM)

Graphics Processor (graphics card)

7

Using API's

Classic Computer Graphics Course: First learn to draw lines, polygons, other 2D shapes.Takes a long time to get to 3D images.

Using Advanced API's (application programming interface):Make use of drawing routines that are already implemented.Concentrate on modeling objects and scenes.We will use the WebGL library of functions.

Based on OpenGLUsed by many computer graphics programmersRelatively platform independent.Don't have to recompile for different systemsDrawback: Not all systems will run it.

8

Light and Images

Light emanates from a light source, bounces off objects and eventually some of it reaches the viewer (or camera).We will diagram this in class.

You can use ray tracing to build up the image, but this is computationally expensive. We will assume uniform brightness of images for now.

9

The Synthetic Camera Model

OpenGL uses a synthetic camera model to form images.

We can diagram this as a pinhole camera. (We will draw this in class).

10

Computing Image Coordinates

Given the coordinates of a point in space, we can compute its location on the image (we will do this in class).

11

Computing the Field of View

We can also compute the field of view for a given image size (we will do this in class).

12

Problem: inverted image

One problem with the pinhole camera model is that the image is upside down.Solution: (we will talk about this in class).