Scribd
Upload
51 views28 pages

Graphics 02 Vecot Raster

This document discusses different types of display and printing hardware, including CRT, LCD, LED, inkjet printers, and laser printers. It then focuses on the differences between raster and vector graphics. Raster graphics use pixels to represent images while vector graphics use mathematical formulas. The key advantages of vectors are that they are resolution independent and have smaller file sizes, while rasters can represent more colors and details in photographic images.

Uploaded by

Tanvir Alam
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
51 views28 pages

Graphics 02 Vecot Raster

This document discusses different types of display and printing hardware, including CRT, LCD, LED, inkjet printers, and laser printers. It then focuses on the differences between raster and vector graphics. Raster graphics use pixels to represent images while vector graphics use mathematical formulas. The key advantages of vectors are that they are resolution independent and have smaller file sizes, while rasters can represent more colors and details in photographic images.

Uploaded by

Tanvir Alam
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 28

CSE- 4105

Display Hardware
 Video Display Devices
 Cathode Ray Tube (CRT)
 Liquid Crystal Display (LCD)
 Light-emitting diodes (LED)

 Hard-Copy Devices
 Ink-jet printer
 Laser printer
 Film recorder
 Electrostatic printer
 Pen plotter
Review

• Vector vs. Raster


– Another place we see this… web-based graphics
• Macromedia flash is vector based
• JPG images are raster based
– CRTs
• Vector based
• Raster based
Raster Graphics
• A raster image is defined by pixels.
• A pixel is the smallest display element that
makes up the images seen on a computer
monitor or television.
• In raster images, the more pixels an image
contains, the higher its resolution.
– For example, in a raster image a square is drawn
as a grid of pixels (dots) and each of those pixels
will have a specific color value.
• Programs such as Photoshop, PaintShop, and
PhotoPaint all work with pixels (raster
images).
CRT
Raster Scan
Vector Scan
Raster Graphics
• How to generate a line using rasters
– A line is represented by assigning some pixels a
value of 1
– The entire line is specified by the pixel values
“Maps” of Dots
“Maps” of Dots
What is the difference between
bitmap(/raster) and vector images?
Bitmap (or raster) images are stored as a series of tiny dots called pi
xels. Each pixel is actually a very small square that is assigned a col
or, and then arranged in a pattern to form the image. When you zo
om in on a bitmap image you can see the individual pixels that ma
ke up that image. Bitmap graphics can be edited by erasing or ch
anging the color of individual pixels using a program such as Adob
e Photoshop.
Unlike bitmaps, vector images are not based on pixel patterns, but inste
ad use mathematical formulas to draw lines and curves that can be co
mbined to create an image from geometric objects such as circles and
polygons. Vector images are edited by manipulating the lines and curv
es that make up the image using a program such as Adobe Illustrator.
Vector images have some important advantages over bitmap images.
Vector images tend to be smaller than bitmap images. That’s because
a bitmap image has to store color information for each individual pixel t
hat forms the image. A vector image just has to store the mathematical
formulas that make up the image, which take up less space.
Vector images are also more scalable than bitmap images. When a
bitmap image is scaled up you begin to see the individual pixels tha
t make up the image. This is most noticeable in the edges of the ima
ge. There are ways of making these jagged edges less noticeable b
ut this often results in making the image blurry as well. When a vecto
r image is scaled up, the image is redrawn using the mathematical f
ormula, so the resulting image is just as smooth as the original.

The three most popular image formats used on the Web (PNG, JPEG
, and GIF) are bitmap formats. The Scalable Vector Graphics (SVG) f
ormat comes in a distant fourth due to a legacy of poor support for
vector graphics in early browsers. Today however, all major browser
s support the SVG (Scalable Vector Graphics) format.

Bitmap formats are best for images that need to have a wide range
of color gradations, such as most photographs. Vector formats, on t
he other hand, are better for images that consist of a few areas of s
olid color. Examples of images that are well suited for the vector for
mat include logos and type.
Bitmap Examples
Problems
• A raster image is resolution-dependant
because it contains a fixed number of pixels
that are used to create the image.
– 160 x 120, 800 x 600, 1400 x 1050
• Since there is a fixed and limited number of
pixels, a raster image will lose quality if
enlarged beyond that number of pixels as the
computer will have to 'make up' the missing
information.
Image Resolution
Making Bigger

100% 200% 500%


(900 x 983 dpi)
Warning! Warning!

 DPI is critical!
 Printers: 300 dpi, 600 dpi
 Monitors: 72 dpi (Internet pictures)
 If you download a picture from the Internet to
print out, make sure it’s BIG!
Vector Graphics
 Vector graphics are created from mathematical
formulas used to define lines, shapes and
curves.
 Vectors can have various attributes such as line
thickness, length and color.
 For example, in a vector image, a square is drawn as
four lines connected at the corners.
 Vector graphics are resolution-independent
because the vector objects are drawn
mathematically in the computer.
Vector Graphics
• How to generate an image using vectors
– A line is represented by endpoints (10,10) to (90,90)
– The points along the line are computed using a line
equation
• y = mx + b
– If you want the image larger, no
problem…
Points, Lines and Fill
Vector Image

100% 200% 500%


Advantages of Vectors

• Resolution Independent
– Regardless of how much the image is enlarged or
reduced, the image definition and quality remain
the same.
• Small File Sizes
– Easily transferred over the Internet.
Disadvantages of Vectors

• Lower color quality than raster images.


– They do not support as many colors.
• Not good for photographic images.
Raster vs Vector Images
Raster vs Vector
Comparing Raster and Vector

 advantages of vector:
 very fine detail of line drawings (sometimes curves), whereas
raster suffers from jagged edge problem due to pixels (aliasing
error , quantization errors)
 geometry objects (lines) whereas raster only handles pixels
 raster display computes all pixels on each line.

 advantages of raster:
 cheaper
 colours, textures, realism
 unlimited complexity of picture: whatever you put in refresh
buffer, whereas vector complexity limited by refresh rate
Conceptual Framework for Interactive Graphics

 Graphics library/package is intermediary between application and display


hardware (Graphics System)
 Application program maps application objects to views (images) of those
objects by calling on graphics library. Application model may contain lots of
non-graphical data (e.g., non-geometric object properties)
 User interaction results in modification of image and/or model
 This hardware and software framework is 5 decades old but is still useful

You might also like