Transcript Document

Chapter Three
Graphical Image and Data
Representation
Dr. Abbas Fadhil Mohammed Ali AL-Juboori
[email protected]
[email protected]
2013
1
Graphics: Terminology
Pixels
picture elements in digital images
Image Resolution
number of pixels in a digital image (Higher resolution always yields
better quality.)
-- Most common Aspect ratio: 3:4 (lines:columns)
Bit-Map
a representation for the graphic/image data in the same manner as
they are stored in video memory.
Bits/pixel
also contributes to the quality of the image.
2
Monochrome (1-bit) image
Simplest type of image
- Each pixel consist of only ON / OFF information
- Called 1-bit monochrome (since no color)
image
- Suitable for simple graphics & text
JBIG (Joint Bi-level Image experts Group ), A compression standard for
binary image
3
Monochrome (1-bit) image
4
Monochrome (1-bit) image
5
Gray (8-bit) image
• Gray levels between 0 to 255 (black to white)
•Image resolution refers the number of pixels in an
image.
-- The higher resolution, the more pixels in the image.
-- Higher resolution allows for more detail and subtle color
transitions in an image.
Image resolution refers the Shown is 256x256 byte
image
6
Gray (8-bit) image
7
Gray (8-bit) image
8
Bits per pixel
9
Color Image
24- bit color image
= Each pixel is represented by 3 bytes, RGB
= Each R, G, B are in the range 0-255
= 256 x 256 x 256 possible colors
= If space is a concern, reasonably accurate color
image can be obtained by quantizing the color
information
8- bit color image
= Carefully chosen 256 colors represent the image
= We get information can be received from the
color histogram
10
Color Image
11
Color Image
= For 640 x 480 image represented with
24 bits requires 921.6 kbytes , How ?
8 bit requires 300 kbytes
= The 8-bit color image stores only the index of the
color, the file header will contain the mapping
information.
= The table where the color information for all the
256 indices is called color lookup table (LUT)
12
Color Image
13
Dithering
• When an image is printed, the basic strategy
of dithering is used, which trades intensity
resolution for spatial resolution to provide
ability to print multi-level images on 2-level (1bit) printers.
• Dithering is used to calculate patterns of dots
such that values from 0 to 255 correspond to
patterns that are more and more filled at
darker pixel values, for printing on a 1-bit
printer.
14
Dithering
• The main strategy is to replace a pixel value
by a larger pattern, say 2×2 or 4×4 binary
matrix, such that the resulting black and white
dot pattern approximates shading.
• For example, if we use a 2× 2 dither matrix
• We can first re-map image values in 0..255
into the new range 0..4 by (integer) dividing by
256/5. Then, e.g., if the pixel value is 0 we
15
Dithering
print nothing, in a 2× 2 area of printer
output. But if the pixel value is 4 we print
all four dots.
• The rule is: If the intensity is > the dither
matrix entry then print an on dot at that
entry location. Replace each pixel by an
n× n matrix of dots.
16
Dithering
17
Dithering
18
Dithering
19
Popular File Formats
Many graphical/imaging applications create their own file
format particular to
the systems they are executed upon.
The following are the most popular System Dependent
Formats:
Microsoft Windows:
BMP

http://www.cica.indiana.edu/grap
hics/image_specs/bmp.format.txt

A system standard graphics file
format for Microsoft Windows

Used in PC Paintbrush and
other programs

It is capable of storing 24-bit
bitmap images
Bitmap File Header Format
Ch
2 Byte “BM”
FileSize
Long
RS
Long
OfsPos
Long
HeadSiz
Long
width
Long
Height
Long
Plan
Integer
BitPlan
Integer
Comp
Long
DataSize
Long
C1
Long
C2
Long
R1
Long
R2
Long
20
Popular File Formats
The following brief format descriptions are the most
commonly used formats. Known as Standard System
Independent Formats
1.
GIF standard: (We examine GIF standard because it
is so simple! yet contains many common elements.)
Limited to 8-bit (256) color images only, which,
while producing acceptable color images, is best
suited for images with few distinctive colors (e.g.,
graphics or drawing).
2.
JPEG: currently the most important common file
format.
21
Popular File Formats
GIF

One of the most important format because of its historical connection to the
WWW and HTML markup language as the first image type recognized by net
browsers.

Graphics Interchange Format (GIF) devised by the UNISYS Corp. and
Compuserve, initially for transmitting graphical images over phone lines via
modems

Uses the Lempel-Ziv Welch algorithm (a form of Huffman Coding), modified
slightly for image scan line packets (line grouping of pixels)

Limited to only 8-bit (256) color images, suitable for images with few
distinctive colors (e.g., graphics drawing)

GIF89a supports simple animation (Graphics Control Extension has control
over delay time, transparent index, etc. Software such as Coral Draw will allow
access and editing of GIF images.)

GIF standard supports interlacing — successive display of pixels in widelypaced
22
Popular File Formats
GIF

Animation via a Graphics Control Extension block in the
data, provides simple control over delay time, a
transparency index, etc.

For the standard specification, the general file format of a
showed in the next slides.

Screen Descriptor comprises a set of attributes that belong
to every image in the file. According to the GIF87 standard,
it is defined as in next slide.
23
GIF
24
GIF
25
GIF
26
GIF
27
GIF
28
JPEG
29
By using Dithering Technique
• Can lower download time
FILE Formats - .GIF options
Dithering:
• dithering increases the apparent number of
colors in the output image.
• Changes the colors of pixels in a
neighborhood so that the average color in
each neighborhood approximates the original
RGB color.
Onion.jpg
8 colors – no dither -
8 colors – dither -
30
By using Dithering Technique
• Can lower download time
.jpg  .gif
FILE Formats - .GIF
• You can reduce the
number of colors in a
GIF and choose
options to control
the way colors dither
in the application or
in a browser.
31
Interlacing
Applies to .GIF files
Interlacing describes --- How images are downloaded to your
screen
Interlacing:
• Is a process by which the image is drawn in a series of passes rather
than all at the same time (file size bigger)
32
Transparency
Applies to
Transparency
Transparent image
• Is one whose background allows the page background to display
through so the image appears to have no visible border around it.
• Image will appear to float right against the page background.
• Currently the only formats that support
transparency are the GIF and PNG formats.
33
Transparency
Image Optimization
- cont
34
Image Optimization
By using Dithering Technique - cont
• Can lower download time
35
JPEG
JPEG: The most important current
standard for image compression.
The human vision system has some
specific limitations and JPEG takes
advantage of these to achieve high rates
of compression.
JPEG allows the user to set a desired
level of quality, or compression ratio
(input divided by output).
36
JPEG
As an example, Fig. 3.17 shows our forestfire. image,
with a quality factor Q=10%.
This image is a mere 1.5% of the original size. In comparison, a JPEG
image with Q=75% yields an image size 5.6% of the original, whereas a
GIF version of this image compresses down to 23.0% of uncompressed
image size.
37
GIF versus JPEG
.GIF
.JPG
• line art, logos, or illustrations
(preserves sharp detail) significantly better on images
with only a few distinct colors,
such as line drawings and simple
cartoons)
•photos, computer game screenshots,
stills from a movie
(realistic shots – JPG is superior to
GIF for storing full-color or gray-scale
images of "realistic" scenes)
• 8 bit color resolution max
•24 bit color resolution
(higher compression that .gif)
• lossless compression
•“lossy” format
• Supports Dithering
•Does not support dithering
•Allows for transparency
•Does not support transparency
•Interlace process
•Progressive jpeg
•Animation
•Not for animation
38
PNG
FILE Formats - .PNG (Portable Network Graphics)
• Developed as a replacement for GIF due to legal issues resulting
from GIFs use of the patented LZW compression scheme
• PNG-8 format uses 8-bit color (Like the GIF format, PNG-8 efficiently
compresses solid areas of color while preserving sharp detail)
• PNG-24 format supports 24-bit color (preserves a large range of
color and subtle variations in brightness and hue)
• Benefits:
• Smaller or same size as GIFs and still lossless (5%-25%
smaller)
• PNG is better than JPG when dealing with images that
contain text or line art, see :
http://en.wikipedia.org/wiki/Portable_Network_Graphics#Comparison_with_JPEG
• Supports opacity and transluacency
• Disadvantage:
• All browsers do not support PNG-8
• No animation
39
PNG
PNG format: standing for Portable Network Graphics
→ meant to supersede the GIF standard, and extends it in
important ways.
Special features of PNG files include:
1. Support for up to 48 bits of color information — a large
increase.
2. Files may contain gamma-correction information for correct
display of color images, as well as alpha-channel information
for such uses as control of transparency.
3. The display progressively displays pixels in a 2-dimensional
fashion by showing a few pixels at a time over seven passes
through each 8 × 8 block of an image.
40
PS & PDF
Postscript is an important language for
typesetting, and many high-end printers
have a Postscript interpreter built into
them.
Postscript is a vector-based picture
language, rather than pixel-based: page
element definitions are essentially in
terms of vectors.
41
PS & PDF
1- Postscript includes text as well as vector/structured
graphics.
2- GL (graphic language) bit-mapped images can be
included in output files.
3- Encapsulated Postscript files add some additional
information for inclusion of Postscript files in another
document.
4- Postscript page description language itself does not
provide compression; in fact, Postscript files are just
stored as ASCII.
42
PS & PDF
- Another text + figures language has begun to
supersede or at least parallel Postscript:
Adobe Systems Inc. includes LZW
compression in its Portable Document Format
(PDF) file format.
– PDF files that do not include images have
about the same compression ratio, 2:1 or 3:1,
as do files compressed with other LZW-based
compression tools.
43