CS320n

1
CS320n Visual Programming

• Image Manipulation

2
What We Will Do Today

• Look at how to alter images using LabVIEW

3
Loading Images VI

• Block Diagram of VI that allows user to load jpg
  images from a file and displays the image

4
Image Data

• The image cluster contains a lot of data
• The heart of the image is an array of ints
• each int only uses 1 byte or 8 bits
• represents a number from 0 255
• three ints in a row represent the red, green, and
  blue intensity for 1 pixel
• elements 0, 1, 2 are for the pixel at row 0,
  column 0, the upper left corner

5
Image Data
6
Image Data
7
RGB Colors

• What color is that pixel at the top left corner?
  Looks very black
• Unbundle image to get at image array

8
RGB Colors

• First three elements of image array are 27, 26,
  and 5
• Intensity of red from 0 to 255
• 0 is none, 255 is maximum
• a little red, a little green, almost no blue
• very close to black, all three 0

9
Viewing a Single Color

• Developed a VI to do this in an early lab
• a single function exists

Controls and indicator added.
10
Sample Single Colors
Black.
Moss?
11
How Many Colors

• If the encoding of an image allows red, green,
  and intensity values of 0 255 there are
• 256 256 256 16,777,216 possible colors
• 1 byte per color per pixel
• 3 bytes total per pixel, 24 bits
• a.k.a. 24 bit image

12
Altering Images

• Some programming tools allow individual pixels or
  areas to be affected, recolored.
• We will look at altering image by affecting all
  pixels in the image
• need to work with the color data
• can work with the array of colors from image
• OR unflatten the image data to a 2d array
• go from an array of 1 dimension (like a list) to
  an array with 2 dimensions, like a table

13
Unflatten Image Function

• Most interested in the 24-bit pixmap

14
Unflattening the Image
Image Wire
Displaying value in element 0,0 Shown as a
hexadecimal number, base 16. 1B red component,
1 16 11 1 27 1A green component, 1 16
10 1 26 05 blue component, 0 16 5 1
5
15
One filter Invert image

• Invert the image
• set each pixel 16,777,215 original value
• auto indexing really shines

2d array
single element
1d array
flatten back to image
16
Original
17
Result