Successfully reported this slideshow.
Graphics 1
Graphics & Graphical
Programming
Lecture 2 - Graphics Fundamentals
Graphics 2
Fundamentals Outline
• Historical perspective
• Model of a Computer - Memory & Graphics
• Devices
• Raster Mode...
Graphics 3
Brief History
• Teletypes(pre 1950s), Display Tubes(post
WW2), CRTs(last half of 20th century), Flat
Panels (mo...
Graphics 4
Computer Memory Model
• Main Memory
• Graphics memory
– Used to be limited to separate
amount on eg graphics ca...
Graphics 5
Memory & Graphics
• Idea is that we can write
programs that interact
with the graphical
display device simply
b...
Graphics 6
Graphical Devices
• Devices eg mouse,
stereo glasses, tracker
ball, light pen, touch
screen, 3d-wand, “rat”,
se...
Graphics 7
Raster Model - Pixels
• Pixel or sometimes “pel”
Picture Element
• Each pixel is a sample
that can be rendered ...
Graphics 8
Coordinate Systems
• Pixel Coordinate System -
rows and columns
• Rectilinear
• Usually for graphics, we
start ...
Graphics 9
Cartesian Coordinates
• Often we use the
Cartesian coordinate
convention ie x,y
coordinates (or x,y,z
in 3D) an...
Graphics 10
Drawing Space or Canvas
• Coordinate Systems
• Drawing Primitives
• Library of utilities
– eg drawDot( int x, ...
Graphics 11
Colours in Brief
• Red Green Blue is not the
Only colour model although
still most common
• We specify separat...
Graphics 12
Graphics Libraries and packages
• What is a graphics
system?
• A package or Library
that links to a Language
o...
Graphics 13
Java Graphics Program Outline
• A short example- MyProg01 draws a black
rectangle inside a white rectangle
• S...
Graphics 14
Java Graphics Code Fragment
// g2 is the Graphics2D object supplied by the system…
g2.setBackground( Color.whi...
Graphics 15
What MyProg01 Output Looks Like
Black rectangle inside a white area…
Graphics 16
Summary
• Graphics has a varied
history
• Very technology driven
• Good advances in recent
years with adequate...
Upcoming SlideShare
Loading in …5
×

fundamentals of Computer graphics(Computer graphics tutorials)

1,549 views

Published on

Do Not just learn computer graphics an close your computer tab and go away..
APPLY them in real business,
Visit Daroko blog for real IT skills applications,androind, Computer graphics,Networking,Programming,IT jobs Types, IT news and applications,blogging,Builing a website, IT companies and how you can form yours, Technology news and very many More IT related subject.
-simply google:Daroko blog(professionalbloggertricks.com)

• Daroko blog (www.professionalbloggertricks.com)
• Presentation by Daroko blog, to see More tutorials more than this one here, Daroko blog has all tutorials related with IT course, simply visit the site by simply Entering the phrase Daroko blog (www.professionalbloggertricks.com) to search engines such as Google or yahoo!, learn some Blogging, affiliate marketing ,and ways of making Money with the computer graphic Applications(it is useless to learn all these tutorials when you can apply them as a student you know),also learn where you can apply all IT skills in a real Business Environment after learning Graphics another computer realate courses.ly
• Be practically real, not just academic reader

Published in: Education
  • Be the first to comment

fundamentals of Computer graphics(Computer graphics tutorials)

  1. 1. Graphics 1 Graphics & Graphical Programming Lecture 2 - Graphics Fundamentals
  2. 2. Graphics 2 Fundamentals Outline • Historical perspective • Model of a Computer - Memory & Graphics • Devices • Raster Model & Bitmaps • Coordinates • Drawing Spaces • Colours • Graphics Libraries
  3. 3. Graphics 3 Brief History • Teletypes(pre 1950s), Display Tubes(post WW2), CRTs(last half of 20th century), Flat Panels (modern era) • Size and Quality (eg resolution) driven by economics (eg 640x320…1024x768…) • Vector (circa WW2) & Raster/Bitmap models • Devices & Human / Machine Interaction • Memory and Processing Speed limitations
  4. 4. Graphics 4 Computer Memory Model • Main Memory • Graphics memory – Used to be limited to separate amount on eg graphics card – Modern idea is to partition main memory dynamically (ie by software instruction) • Modern idea is to map memory to the display • Independent of display hardware type • CPU + Cache memory + Main memory • Cache memory is fast but expensive so (still often) only have small amount eg 512kBytes available • Main memory relatively plentiful (eg GBytes) but slow
  5. 5. Graphics 5 Memory & Graphics • Idea is that we can write programs that interact with the graphical display device simply by writing to a predetermined area of the computer’s memory • Known as Bitmap graphics • The bits are mapped to the pixels • Flexible, portable software • Independent of Hardware & Operating System
  6. 6. Graphics 6 Graphical Devices • Devices eg mouse, stereo glasses, tracker ball, light pen, touch screen, 3d-wand, “rat”, sensor gloves, head tracker, iris tracker,… • Even Mouse varies in form factor and number of buttons • Mouse - most well known device • Buttons, and scan movements • Jargon ideas that have become common: – Drag – Click – Double-Click – Left -Click • Main idea is to let you specify a location in a space eg x,y (or x,y,z) coordinates
  7. 7. Graphics 7 Raster Model - Pixels • Pixel or sometimes “pel” Picture Element • Each pixel is a sample that can be rendered as a dot or rectangle on the screen • Often try to design them as squares but not always • Might be implemented as small area of phosphor on a monochrome monitor • Or three areas of eg red, green and blue phosphors for colour • Or simple a transistor logic gate assembly on a flat panel display
  8. 8. Graphics 8 Coordinate Systems • Pixel Coordinate System - rows and columns • Rectilinear • Usually for graphics, we start at top left corner and work our way across and down • Same as raster orientation • Array[row][column] • Row major used in C and C+ ( last index moves fastest in memory) • Not all languages do it this way - eg Fortran uses column major (first index moves fastest)
  9. 9. Graphics 9 Cartesian Coordinates • Often we use the Cartesian coordinate convention ie x,y coordinates (or x,y,z in 3D) and map this to our display • Usually column corresponds to x, and -row corresponds to y • This works if we know the max min values. • Common values are eg 640 columns x 320 rows • Or 1024x768 or better • Aspect ratio is the ratio of these eg 4:3 - Chosen to suit the common display devices eg TV screens or monitors x y
  10. 10. Graphics 10 Drawing Space or Canvas • Coordinate Systems • Drawing Primitives • Library of utilities – eg drawDot( int x, int y); – Or drawLine( x1, y1, x2, y2 ); • Usually we have “Primitive” Models for coordinate spaces and colours • We do not want to write our application programs worrying about pixel resolutions • We may have libraries that allow us to do so, but often they will support more general coordinates • Eg real space “normalised” coordinates [0.0,1.0]
  11. 11. Graphics 11 Colours in Brief • Red Green Blue is not the Only colour model although still most common • We specify separate RGB values for each pixel • They map to intensities • All colours can be expressed as combination of these • Sometimes also an “alpha” or transparency value • These will conveniently pack into a computer word of 4 bytes, one byte for each entity • 1 Byte gives us 256 values - hence numbers of colours • Need not use this resolution • Can also use Look-up tables to save memory
  12. 12. Graphics 12 Graphics Libraries and packages • What is a graphics system? • A package or Library that links to a Language or environment and lets us write programs that are independent of the graphics hardware and devices • Java Development Kit and Java 2D and Java 3D libraries • GL and OpenGL (Graphics Library), VOGL • X11, DirectX, PHIGS,… and lots of others
  13. 13. Graphics 13 Java Graphics Program Outline • A short example- MyProg01 draws a black rectangle inside a white rectangle • See the course web pages for these codes • Use a text editor or your favourite text tool (eg emacs or vi or notepad) to create MyProg01.java • Compile it using javac MyProg01.java • Run using java Myprog01
  14. 14. Graphics 14 Java Graphics Code Fragment // g2 is the Graphics2D object supplied by the system… g2.setBackground( Color.white ); // set background colour g2.clearRect( 0, 0, getWidth(), getHeight() ); // clear an area g2.setColor( Color.black ); // set the drawing colour g2.fillRect( 10, 10, 20, 20 ); // fill in a rectangle of that colour g2.drawRect( 0, 0, getWidth()-1, getHeight()-1 ); // draw a border around everything • More on how this works next lecture and at the tutorials…
  15. 15. Graphics 15 What MyProg01 Output Looks Like Black rectangle inside a white area…
  16. 16. Graphics 16 Summary • Graphics has a varied history • Very technology driven • Good advances in recent years with adequate memory and processing power • Primitives and library layers approach is very common • Note devices and memory model • Colour models and drawing spaces are important ideas for our programs • We will use the Java Development Kit graphics libraries and primitives

×