1. Lecture 8: Basic Images Manipulation (2)

2. Contents
Displaying image in Java
Printing
Manipulation of pixel data

3. Displaying Image in Java
Image display using awt.
Image display using swing components.

4. Printing
How do we simulate intermediate shades of grey in an 8-bit image?
How can we use small number of coloured inks to simulate the huge range of colours possible in a 24-bit image?

5. Printing Grayscale Images
Problem: How to print a gray-scale image when the only color ink available is black (the ink) and white (the paper)?
This is the problem faced by newspapers and any other print media.
Newspapers print at DPI (dots per inch)
Magazines print at DPI
Color printing is a more complicated variant of this problem.
The solution is to use a technique known as halftoning.
The process of generating binary pattern of black and white dots from an image.

6. Halftoning
Photographs are images with continuous shades of black, white, and gray. These shades are tones.
Halftoning is a technique, originally developed for the printing industry, to reproduce continuous tone images using printing techniques capable of black and white only, not shades of gray.

7. Need for Digital Image Halftoning
Introduction
Need for Digital Image Halftoning
Examples of reduced grayscale/color resolution
Laser and inkjet printers ($9.3B revenue in 2001 in US)
Facsimile machines
Low-cost liquid crystal displays
Halftoning is wordlength reduction for images
Grayscale: 8-bit to 1-bit (binary)
Color displays: 24-bit RGB to 12-bit RGB (e.g. PDA/cell)
Color displays: 24-bit RGB to 8-bit RGB (e.g. cell phones)
Color printers: 24-bit RGB to CMY (each color binarized)
Halftoning tries to reproduce full range of gray/ color while preserving quality & spatial resolution.

8. Halftoning
The process of transforming a grayscale image to a halftone.
Create the illusion of gray-scale by varying the average dot density in local regions of the image
Dots are always something that can be counted and it must be possible to hold a measuring stick to them.
Takes advantage of the fact that the eye integrates intensity of small image regions.
Sacrifices spatial resolution for gray-scale resolution (unless the output device can be over-sampled as most ink-jet printers are these days)
Spatial refers to image itself, based on direct manipulation pixels.

9. Halftoning
Consider a grayscale image (left) which is halftoned (right) for printing. The right image looks like a grayscale image but is actually only black and white!
                                                               
Zooming in on the image reveals “pixel” sizes of differing sizes and shapes.
Source:

10. Halftoning

11. Digital Halftoning
The previous example is from the domain of print media which uses physical filters, lights, and film to generate the halftoned images.
Digital halftoning cannot be done this way since digital images consist of identically shaped pixels (usually rectangular) which are either black or white.
The main problem is “Should this pixel be white or black”?
Several solutions to this problem exist
Bi-level Thresholding
Font/Pattern replacement
Random thresholding
Dither matrices
Error Diffusion

12. Bilevel Thresholding Re-quantize the image using a 1 bit color
If the gray-level of a pixel is less than some threshold value then set the output to black otherwise set the output to white.
The threshold value may be the “center of the available gray-scale range”
The threshold value may by the “average of all pixels in the image”
The T value can be choosen e.g inspecting the histogram image f. or

13. Bi-level Thresholding Example
Original Image
Absolute Threshold
Adaptive Threshold

14. Patterning
This is the age-old trick of substituting a “font” pattern for each pixel.
Replacing each pixel by a pattern taken from binary font.
Consider the following 3x3 font pattern 1 2 3 4
This font can be used to print an image consisting of 10 gray levels 5 6 7 8 9
Grey level 9
Since we are replacing each pixel by a 3x3 block of pixels, both the width and height of the image increased by a factor of 3

15. Patterning

16. Patterning
algorithm patternHalftone(im, font)
INPUT: Grayscale image im and a set of font patterns
OUTPUT: BW halftone of the input
Let output be an “empty” image
for every pixel P in im
let F be the font that most closely approximates the actual gray-level of P
replace pixel P with font F in the output image
return output
Given an NxN font there are N2+1 “gray levels” to choose from. N < number of grayscale level.
The output image is N times larger (in both dimensions) than the original.
Font patterns must be chosen carefully to avoid the introduction of artificial patterns into the output.
Drawback – create false lines and contours in homogeneous image regions.

17. Patterning Example Pattern the gray-scale image below 33 113 234 64
121
219 92
133
245 1 4 8 2 3 5 9 33
113
234 64
121
219 92
133
245
pixels scaled to the
corresponding font value
binary output image
Same image shown in grayscale

18. Patterning Example

19. Random Thresholding
Selects a threshold value at random for every pixel.
The output is white if the pixel value exceeds the threshold and black otherwise.
High intensity pixels have a greater chance of becoming white while low intensity pixels have a greater change of becoming black
Attempts to spread the error per pixel evenly (or randomly) throughout the image
algorithm randomDither(image)
INPUT: An image
OUTPUT: A B/W dithered version of the input
Let output be an “empty” image
for every pixel P of the input
let T be a random value between 0 and 255
if P <= T then output black
else output white
return output

20. Random Dithering Example

21. Dither Matrices
Selects a threshold value using a pre-determined pattern.
The output is white if the pixel value exceeds the pre-determined threshold and black otherwise.
The matrix is laid like a tile over entire image and each pixel value is compared with the corresponding threshold from the matrix.
Attempts to spread the error per pixel evenly throughout small regions of the image (and hence, throughout the entire image).
algorithm matrixDither(image, M)
INPUT: An image and an NxN “dither” matrix M
OUTPUT: A B/W dithered version of the input
Let output be an “empty” image
for every pixel P(x,y)of the input
let T be M[x%N][y%N]
if P <= T then output black
else output white
return output

22. D1 and D2 Dither Matrices D1 = 1 3 2 64 192 128 D2 = 5 13 7 15 9 1 1164
192
128
D2 = 5 13 7 15 9 1 11 3 6 14 4 12 10 2 8 80
208
112
240
144 16
176 48 96
224 64
192
160 32
128

23. 2x2 Pattern Dithering Example

24. 4x4 Pattern Dithering Example

26. Halftoning: Floyd-Steinberg error diffusion
Typical threshold value is 128 for images with pixel values in [0,255]
To correct the errors introduced by thresholding.
Selects a threshold value which is at the center of the gray-scale range
The output is white if the pixel value exceeds the threshold and black otherwise.
The error of a pixel is the difference between the actual value of the pixel and the value selected (black or white)
This error is carried over to nearby pixels in a systematic way
This gives an average density of white dots proportional to the average intensity level within a region of the image
Pixel
7/16
3/16
5/16
1/16

27. Floyd-Steinberg
Pseudocode

28. Floyd-Steinberg

29. Java implementation of Algorithm 5.1
Floyd-Steinberg
Java implementation of Algorithm 5.1

30. Floyd-Steinberg

31. Floyd-Steinberg
Returns the smaller of two int values. That is, the result the argument closer to the value of Integer.MIN_VALUE. If the arguments have the same value, the result is that same value.

32. Floyd-Steinberg Example
<128 35 89 95
132 68
112
100
150 51 45 98
127 ?
0.4375*error 35 89 95
132 68
112
100
150 51 45 98
127 15 11 2 35
104 95
132 79
114
100
150 51 45 98
127 +
Error = 35
0.3125*error

33. Floyd-Steinberg Example35
104 95
132 79
114
100
150 51 45 98
127 ? 35
104 95
132 79
114
100
150 51 45 98
127 46 20 33 7 35
104
141
132 99
147
107
150 51 45 98
127
Error=104

34. Floyd-Steinberg Example
>128 35
104
141
132 99
147
106
150 51 45 98
127
255 ? 35
104
141
132 99
147
107
150 51 45 98
127
-50
-21
-36 -7 35
104
141 82 99
126 71
143 51 45 98
127
Error= =-114

35. Floyd-Steinberg Example
The sum of all gray levels in the input is The sum of all values in the output is The average per-pixel error is –6.83
127 98 45 51
150
100
112 68
132 95 89 35
Input Image
255
Output Image
Note that this is not an in-place algorithm. Extra storage is required! (i.e. copy the input image and then manipulate the copy)

36. Floyd-Steinberg Error Diffusion

37. Colour Printing

38. Colour Printing (Great 1 Page tutorial from Adobe)
Color prints are typically constructed from 4 half-toned images using the CMYK color model (K is black).
The individual planes are halftoned using rotated screens to avoid odd-patterned moire effects.
The screen angles are typically
Y=0°     C=15°     M=75°     K=45°
Source:

39. Colour Printing (Great 1 Page tutorial from Adobe)
When viewed with the naked eye at normal viewing distance (inset), the image appears to have continuous color tone. When viewed closely, the superimposed cyan, magenta, yellow, and black halftones become apparent.
Source:

40. Colour Half-toning interlaced pixels
A common problem arises when displaying images on systems with limited resources.
Imagine a web browser loading a 24-bit image. The web browser is using an 5-bit display with a pre-configured color palette. How can the image be displayed?
Color dithering is used to display high-color images using a limited palette of colors. The usual algorithm is a modification of Floyd-Steinberg diffusion.
interlaced pixels

41. Colour Dithering

42. Colour Halftoning

43. Colour Halftoning So What's Really Important? Hints
The choice of color reduction function and options depends upon the requirements for speed of execution, image quality, and ability to display multiple images at the same time.
Hints
For fastest speed use a standard palette.
For highest image quality use diffusion scatter.
To display multiple images simultaneously use the same palette for all images.

44. Colour Dithering

45. Colour Dithering When do we need dithering?
Under fixed lighting conditions the typical person can discern approximately 100 different brightness levels. This number varies slightly with hue (for instance we can see more distinct shades of green than blue). Which particular set of 100 levels also changes as a function of the ambient lighting conditions.
The 256 colors available for each primary in a true color display are usually adequate for representing these 100 levels under normal indoor lighting (when the nonlinearities of the display are properly compensated for). Thus, there is usually no need to dither a true color display.
On index displays dithering is frequently used to represent color images. Given a 256 entry color map you can only represent approximately 6 colors per red, green, and blue primary (6x6x6=216). However, if just one or two hues are used it is possible to allocate enough color table entries (~50 per hue) so that dithering can be avoided.

46. Color Dithering

47. Color Dithering Problems with dithering
When a signal, or color, is modified from it original value by the addition of some other value, it is said that noise has been added
White noise generates values within some interval such that all values are equally likely. Solution generate symmetric values.

48. Color Dithering
To find the error between two RGB colors, compute the length of the 3D vector between the colors.
algorithm colorDither(Image IM, Palette CP)
for every pixel P in IM (left-to-right-top-to-bottom)
set the color of P to the nearest matching color in CP
diffuse the error using floyd-steinberg on each band

49. Color Dithering

50. Manipulation of Pixel Data
Extracting regions of interest.
Basic geometric manipulation.

51. Extracting Region of Interest
A region of interest (ROI) is a rectangular area within the image defined either by:
The coordinates of the pixels at its upper-left & lower-right corners or
The coordinates of the pixels at its upper-left corner & its dimensions.
Commonly use to limit the extent of image processing operations to some small part of the image.
Interactive image processing software will often provide facility to define ROIs of images using mouse etc.

52. Extracting Region of Interest
Java’s BufferedImage class has 3 methods that useful when operating on ROIs:
Raster getData(Rectangle rect)
Void setData(Raster raster)
BufferedImage getSubimage(int x, int y, int w, int h).
Example of ROI application: MeanROI application, which displays an image, allow the user to draw a ROI on it and then computes mean grey level within that ROI (see course web page).

53. Extracting Region of Interest
The getData() method takes as its sole parameter a Rectangle object that specifies the position and dimensions of the ROI. It returns the data from that ROI as a Raster object. The data stored within the raster are independent of the image on which getData() was called, so subsequent changes to the image will not affect the raster. However, the raster’s coordinate system is that of the original image. This means that the first pixel in the raster has the same coordinates as the ROI’s origin. We must be carefhl to take this into account when processing raster data.
Instances of Raster are read-only, but we may cast the object returned by getData() to a WritableRaster if we wish to modify the pixel values. The modified raster can then be loaded back into its parent image by invoking the setData() method of the image, with the raster as a parameter.
If in-place processing of a ROI is required, the getSubimage() method of BufferedImage may be more convenient. Given the coordinates and dimensions of the ROl as parameters, this method returns a subimage that shares the same data array as the parent image. This means that changes made to pixel values in the subimage will affect the parent image. The coordinate system of the subimage is not that of the parent image, so its pixels are indexed starting from (0, 0).
An example of ROl usage can be seen in Listing This shows two versions of a method meanValue(). The first computes the mean pixel value in the supplied image (assumed to be greyscale). The second computes the mean within a ROI specified by a Rectangle object. Note that there is no need to duplicate any code in the second version of the method; all that we need to do is invoke getSubimage() on the image using the ROI parameters contained in the Rectangle object and then pass the image that is returned to the first version of meanValue(). Both of these methods are used in the MeanROI application described earlier.

54. Extracting Region of Interest

55. Basic Geometric Manipulation
Enlargement or shrinking.
Accomplished by replicating or skipping pixels.
Used to magnify small details in an image , or reduce a large image in size.
For a pixel (x,y) in the output image (enlarge by factor n), the corresponding pixel in the input image is at (x/n,y/n).
To shrink an image by n factor, we must sample every nth pixel in the horizontal and vertical dimension and ignore the others.

56. Basic Geometric Manipulation
Rotation.
Relatively simple to implement for the special case where the angle is a multiple of 900.
Reflection along the x or y axis.
Reflection along either of the image axes is simply involves reversing the ordering of pixels in the rows or columns of the image.

60. You can work in a group (maximum of 3 students in a group).
Assignment 2 (20%)
Write a Java program that can:
Read and display an image file.
Perform the following digital halftoning and display the halftone images:
Random Thresholding
Floyd-Steinberg error diffusion
Allow the user to select a region of interest (ROI) and then:
Extract the ROI from the image and display the enlarged (by a factor of n) image.
Allow the user to select the reflection line and display the output.
You can work in a group (maximum of 3 students in a group).

61. Thank you Q&A