1. CS320n –Visual Programming
Image Manipulation

2. What We Will Do Today Look at how to alter images using LabVIEW
Visual Programming
Image Manipulation

3. Loading Images VI
Block Diagram of VI that allows user to load jpg images from a file and displays the image
Visual Programming
Image Manipulation

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
Visual Programming
Image Manipulation

5. Image Data
Visual Programming
Image Manipulation

6. Image Data
Visual Programming
Image Manipulation

7. RGB Colors
What color is that pixel at the top left corner? Looks very black
Unbundle image to get at image array
Visual Programming
Image Manipulation

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
Visual Programming
Image Manipulation

9. Viewing a Single Color Developed a VI to do this in an early lab
a single function exists
Controls and indicator
added.
Visual Programming
Image Manipulation

10. Sample Single Colors Black. Moss? Visual Programming
Image Manipulation

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
Visual Programming
Image Manipulation

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
Visual Programming
Image Manipulation

13. Unflatten Image Function
Most interested in the 24-bit pixmap
Visual Programming
Image Manipulation

14. Unflattening the Image
Image Wire
Displaying value in element 0,0
Shown as a hexadecimal number,
base 16.
1B = red component, 1 * * 1 = 27
1A = green component, 1 * * 1 = 26
05 = blue component, 0 * * 1 = 5
Visual Programming
Image Manipulation

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
Visual Programming
Image Manipulation

16. Original
Visual Programming
Image Manipulation

17. Result
Visual Programming
Image Manipulation