INTRODUCTION
Computer Graphics
1 INTRODUCTION: THE OUTLINE
I. Image Processing / Computer Graphics II. Advantages III. Representative Uses IV. Classification of Applications V. History VI. Conceptual Framework VII. Our First Assignment
2 I. IMAGE PROCESSING / COMPUTER GRAPHICS
• Image Processing: • Analysis and reconstruction of existing images • Sub-Areas: • Image Enhancement • Pattern Detection and Recognition • Scene Analysis • Computer Vision
3 I. IMAGE PROCESSING
4 IMAGE ENHANCEMENT
Apex Sharpening of Andromeda Galaxy Image http://math.nist.gov/mcsd/highlights/carasso-spie06.html
5 PATTERN DETECTION AND RECOGNITION
Body parts detection for people tracking using trees of Histogram of Oriented Gradient descriptors, http://hal.inria.fr/INRIA/inria-00496980/en/
6 SCENE ANALYSIS
The Vision and Mobile Robotics Laboratory, http://www.cs.cmu.edu/~vmr/jobs/jobs.html
7 COMPUTER VISION
Software That Evaluates Facial Expressions , http://www.sciencedaily.com/videos/computers_math/internet/5/
8 I. IMAGE PROCESSING / COMPUTER GRAPHICS
• Computer Graphics: • Synthesis of new images • Overlap between the two is growing • William Latham, Evolutionary Art
9 II. ADVANTAGES
• Communication between user and computer • Interactive graphics • Creation of abstract, synthetic objects • Not confined to static images: animation • User controlled dynamics
10 III. REPRESENTATIVE USES
• User Interfaces • Interactive Data Plotting • Office Automation / Electronic Publishing • Computer-Aided Drafting and Design
http://www.warmelin.com/cad-cam.html
11 III. REPRESENTATIVE USES
• Simulation and Animation • Scientific • Entertainment • Art and Commerce • Process Control • Cartography
12 IV. CLASSIFICATION OF APPLICATIONS
• Dimensionality • Kind of Picture • Type of Interaction • Role of the Image / Graphic • Relationship between Objects and Pictures • Logical • Temporal
13 DIMENSIONALITY: 2D AND 3D
http://www.media-freaks.com/articles/3d-animation-studios-what-goes-on-behind-those-closed-doors
14 KIND OF PICTURE: LINE DRAWING / WIREFRAME
Grand Designs 3D Software
15 KIND OF IMAGE: COLOR / GRAYSCALE
16 TYPE OF INTERACTION
• Offline Plotting • Interactive Plotting • User Moves Around (or within) Object • Interactive Object Design
17 ROLE OF THE IMAGE / GRAPHIC
• Picture as End Product • Cartography • Drafting • Artwork • Animation • Picture as Means to an End • CAD/CAM
18 V. HISTORY
• Beginnings • Crude Plotting • Sutherland 1963 • Sketchpad
19 V. HISTORY
• Output Technology • Vector Display • Oscilloscopes were some of the 1st computer displays • Computation results used to drive the vertical and horizontal axis (X-Y) • Intensity could also be controlled (Z-axis) • Used mostly for line drawings • Display list had to be constantly updated (except for storage tubes) • Raster Display
20 V. HISTORY
• Output Technology • Vector Display
• Raster Display
Raster
21 V. HISTORY
• Input Technology • Light Pens • Mouse, Tablet, Touch Screen, Audio • Kinect
22 V. HISTORY
• Software • Device Dependent – Device Independent • Program Portability • Programmer Portability • Standards • Core • GKS and GKS-3D • PHIGS and PHIGS+ • Industry Standards (as opposed to official standards) • OpenGL (SGI) • Java-2D and Java-3D (Sun) • DirectX (Microsoft) • X-Windows (MIT/Unix/Linux) • …
23 VI. CONCEPTUAL FRAMEWORK
Software Hardware
Graphics System/ GPU Application Application Graphics Model/data program Library base
24 VI. CONCEPTUAL FRAMEWORK
• Application Model • Application Database • Property Information • Created by: • Application Program • User Interaction
25 VI. CONCEPTUAL FRAMEWORK
• Application Program • Translation of the Model to Graphics Commands • Database Traversal • Translation to Geometric Primitives • User Interaction Handling • Sampling vs. Event Driven • Event Loop Model • State and Screen Update vs. State, Screen and Database Update
26 VI. CONCEPTUAL FRAMEWORK
• Application Program • Two Basic Paradigms: Sample-Based and Geometry-Based • Sample-based graphics: discrete samples are used to describe visual information • pixels can be created by digitizing images, using a sample-based “painting” program, etc. • often some aspect of the physical world is sampled for visualization, e.g., temperature across the US • example programs: Adobe Photoshop™, GIMP™ , Adobe AfterEffects™
27 SAMPLE-BASED GRAPHICS • Images are made up of grid of discrete pixels, for 2D “picture elements” • Pixels are point locations with associated sample values, usually of light intensities/colors, transparency, and other control information • Samples created directly in paint-type program, or as sampling of continuous (analog) visual materials • Sample values can also be input numerically • Once an image is defined as pixel- array, it can be manipulated via: • Image editing • Image processing
28 SAMPLE-BASED GRAPHICS • Advantages: • Once image is defined in terms of colors at (x, y) locations on grid, can change image easily by altering location or color values • Pixel information from one image can be copied and pasted into another, replacing or combining with previously stored pixels • Disadvantages: • WYSIAYG (What You See Is All You Get): • no depth information • can’t examine scene from different point of view • at most can play with the individual pixels or groups of pixels to change colors, enhance contrast, find edges, etc.
29 GEOMETRY-BASED GRAPHICS
• Geometry-based graphics (also called scalable vector graphics or object-oriented graphics) • Store mathematical descriptions, or “models,” of geometric elements (lines, polygons, polyhedrons…) and associated attributes (e.g., color, material properties). • Images created as pixel arrays (via sampling of geometry) for viewing, but not stored as part of model. Images of many different views are generated from same model • Users cannot usually work directly with individual pixels in geometry-based programs; as user manipulates geometric elements, program resamples and redisplays elements
30 GEOMETRY-BASED GRAPHICS MODELING VS. RENDERING
• Modeling • Rendering • Create models • Take “picture” with camera • Apply materials to models • Both can be done with commercial software: • Place models around scene • Autodesk MayaTM ,3D Studio MaxTM, • Place lights in scene BlenderTM, etc. • Place the camera
Point Light
Spot Light
Directional Light Ambient Light
31 VI. CONCEPTUAL FRAMEWORK
• Graphics Library • Graphics Subroutine Library or Package • Intermediary between Application and Display Hardware • Examples: OpenGL™, DirectX™, Windows Presentation Foundation™ (WPF), RenderMan™ • Primitives (characters, lines, polygons, meshes,…) • Attributes • Color, line style, material properties for 3D • Lights • Transformations • Immediate mode vs. retained mode
32 VI. CONCEPTUAL FRAMEWORK
• Graphics System / GPU • Logical Display Device • User Interaction • Modification of Model and/or Image
33 OUR FIRST ASSIGNMENT
34 THE CODE
import static com.jogamp.opengl.GL4.*; import java.nio.FloatBuffer; import javax.swing.JFrame; import com.jogamp.common.nio.Buffers; import com.jogamp.opengl.*; import com.jogamp.opengl.awt.*;
@SuppressWarnings("serial") public class Code extends JFrame implements GLEventListener { private GLCanvas myCanvas;
public Code() { setTitle("Chapter2 - program1"); setSize(600,400); setLocation(200,200); myCanvas = new GLCanvas(); myCanvas.addGLEventListener(this); getContentPane().add(myCanvas); setVisible(true); }
public void display(GLAutoDrawable drawable) { GL4 gl = (GL4) GLContext.getCurrentGL();
float bkg[] = { 1.0f, 1.0f, 0.0f, 1.0f }; FloatBuffer bkgBuffer = Buffers.newDirectFloatBuffer(bkg);
gl.glClearBufferfv(GL_COLOR, 0, bkgBuffer); }
public static void main(String[] args) { new Code(); }
public void init(GLAutoDrawable drawable) {} public void reshape(GLAutoDrawable drawable, int x, int y, int width, int height) {} public void dispose(GLAutoDrawable drawable) {} }
35 SUMMARY
I. Image Processing / Computer Graphics II. Advantages III. Representative Uses IV. Classification of Applications V. History VI. Conceptual Framework VII. Our First Assignment
36