Computer Graphics in Java
CR325
Graphics2D standard
WMFGraphics2D
Font test - serifuniform scale
rotated sansserif
dialog font transform
Graphics standard
WMFGraphics
extra
WM
F comm
andsW
MF com
mands
What is Computer Graphics?
• A kind of Data processing• Voice and Signal Processing = 1D data
processing• Image Processing = 2D data processing• Computer Graphics = 3D data in with 2D
data out. Geometry is transformed into images.
What do we study in CG??
methods for digitally synthesizing and manipulating visual content
What do people study in CG?
• How to do 2D drawing– How to draw a line– How to draw a circle, etc.
• How to do 3D drawing– How to draw a 3D line– How to draw a sphere, etc.
Why study Computer Graphics?
• Entertainment• Visualization of data (analysis)• Simulation can be visualized with CG.• CAD (Computer Aided Design)
2D Computer Graphics
• Synthesis of images—from two-dimensional models
Two kinds of 2D Computer GraphicsRaster andVector
Vector Graphics
• geometrical primitives (e.g., points, lines, curves, and shapes or polygon(s)), to represent images
Where do we get input?
• Pick device– Gives us a location– Mouse, light-pen, arrow-keys, keyboard,– Joystick, tablet, scanner, image– video camera with a cooperative target.– Geometries– Dynamics, kinematics (math).
Graphics Systems Five major elements - processor, memory,
frame buffer, output devices, input devices
Displays
• Color Monitors are made for people• physiological arguments are used for
display design
What is light?
• any electromagnetic energy• visible light is typically visible to the
human visual system (eye).
Output Devices The cathode-ray tube CRT
Output Devices RGB – shadow mask
Spectra of the Human Visual System
• ranges from 400 nm wavelength to about 800 nm, 1 nm = 10 ** -9 meters
• d = rate * time• rate = c = 3 * 10 ** 8 meters / second• d = wavelength = 400 * 10 **-9 meters• T = lambda/c, f = 1/T = c / lambda• f = 3 * 10 ^ 8 / 4 * 10 ^ -7 =750.*10^12?
Trading an eye for an ear
optical axiscornea
lensoptic disk
optic nerve
retina
fovea centralis
iris
Human Visual System - HVS
• rods and cones excited by electromagnetic energy in the range 350-780 nm
• sizes of rods and cones determines the resolution of HVS – our visual acuity
• the sensors in the human eye do not react uniformly to the light energy at different wavelengths
Human Visual System - HVS
Courtesy of http://www.webvision.med.utah.edu/into.html
Human Visual System• different HVS response for single
frequency light – red/green/blue• relative brightness response at
different frequencies• this curve is known as
Commision Internationale de L’Eclairage (CIE) standard observer curve
• the curve matches the sensitivity of the monochromatic sensors used in black&white films and video camera
• most sensitive to GREEN colors
Response curves
• Eye has Gaussian response to light.• Gives rise to biologically motivated image
processing
Human Visual System• three different cones in HVS• blue, green & yellow – often reported as red for compatibility with camera & film
An eye is a Multi-mega pixel camera
• It has a lens (adjustable zoom)• It has an automatic f-stop (iris 2-8 mm)• It has a sensor plane (100 million pixels)• The sensor has a transfer function senstive
to mesopic range; 380 to about 700 nm
The eyes have a USB2 data rate!
• 250,000 neurons in the optic nerve• variable voltage output on EACH nerve• 17.5 million neural samples per second• 12.8 bits per sample• 224 Mbps, per eye (a 1/2 G bps system!).• Compression using lateral inhibition
between the retinal neurons
Introduction to 2D Graphics
• Draw some 2D geometries.• Input is 2D geometry• Ouput is image.
How do we represent an image?
• Image Processing answer: 2D array of pixels
• Computer Answer: BREP:vectors
• to the right is a bitmap• vector vs. bitmap
What is an Image?
• a 2D array of pixels• a pixel is a scalar quantity that represents
the intensity of light. It smallest area within the given image.
Pixels and Frame Buffer Most graphics systems are pixel based – need of rasterization or
scan conversion; pixel = picture element8 bits deep frame – 256 colors; 24 or 32 bits for RGB colors
picture detail
What is a PIXEL
• A picture element.• Typically a pixel can be described as an
intensity for light at a given location.– Location (200,20), I = 255; // gray scale– Location (34,50), R=255, G= 0, B =0; //red
pixel.• Looks like a dot!
How do we represent a pixel?
• how do we represent light?
How do we represent a pixel
• assume that the pixel is for humans.• You need to know the dynamic range of the
eye!• 1 part in a million is needed for a pixel that
displays on a monitor for people.• Typically we use 24 bits per pixel, 8 bits
per color.
Quantization of an Image
• Computers use digital cameras -> quantization
SNR6b 4.8
SNR 10 log 3 22 b 20b log2 10log 3
Quantization Error is visible
peter packed a pickled pixelits color was that of hash.
And every system that displayed it would crash!
Displays are designed for
• human visual system (eye)• Painting with LIGHT (additive synthesis)
display• This is not painting with MUD! (subtractive
synthesis) printer
Overview public int filterRGB (int rgb) { int r = (rgb & 0xff0000) >>16; int g = (rgb & 0xff00) >> 8; int b = rgb & 0xff; int gr = (r + g + b) / 3;int p = 0xff000000 | (gr << 16) | (gr << 8) | gr; return p// p = 0xffgrgrgr;
How would do you pack RGB?
• int pack(int r, int g, int b) {return 0xff000000 | (r << 16) | (g << 8) | b;• }
How do I represent the following in decimal
• int I = 1;• int k = ~I+1;• how much is k? Ans: -1
Intro to bitwise ops
• and - & - bitwise (not && is logical)• or - | - bitwise (not || is logical)• not - ~ - bitwise (not !, is logical)• xor - ^ - bitwise (has no logical
correspondence)
Intro to ANDing
• int I = 0;• int j = 1;• I&I is 0• I&J is 0• J&I is 0• J&J is 1
Intro to Oring
• int i=0xF0; S={0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f}• int j =0x0F;• i|I is 240 = 0xF0• i|j is 255 in decimal = 0xFF• 0xF0 = (in base 2) 11110000• 0x0F = (in base 2) 00001111• 0x0F | 0xF0 = 11111111
Using hex for ANDing
• int i=0x7a;• int j =0x0F;• how much is i&j ?• 01111100 &• 00001111 =• 00001100 = 0x0c
using hex for not
• int i=0x7a;• int j =0x0F;• how much is ~j? 0xfffffff0nibble is 4 bits, byte is 8 bits
using hex for xor
• int i=0x7a;• int j =0x0F;• how much is i^j?• 01111100 = I^• 00001111 = j• 01110011 = i^j = 0x73
Common Radicies
• in java, you can use:• binary (base 2) Radix 2• octal (base 8) Radix 8• decimal (base 10) Radix 10• hexidecimal (base 16) Radix 16
How come they call it base 2?
• You can only have 0 and 1, so why call it base 2?
• Why not call it base 1?• Cardinality of the set of symbols is the radix
S = {0, 1}, card(s)=2
Why call it a base?
• The base of the exponent!• 1101, base 2 is, in decimal• 1*2^3 + 1 * 2^2 + 0 * 2 ^ 1 + 1• = 8 + 4 + 0 + 1 = 13 base 10.• This is called positional notation.
Doing the positional notation in hex
• 0x28 = 2 * 16 ^ 1 + 8 * 16 ^ 0• = 2 * 16 + 8• = 32 + 8 = 40 base 10