John Nicholson
nicholsonja@apsu.edu
Austin Peay State University, Clarksville, TN
Images can provide a relatively easy way to introduce introductory programming concepts. They often require students to read and write files, and use arrays. They can also introduce students to real-world problems with programming-based solutions.
This assignment introduces students to the median filter used in image processing for removing noise, or in this case, a pesky tourist. The assignment involves a tourist who keeps getting in the way of a sculpture that is being photographed. The tourist is essentially noise, which can be removed using the median filter. The median filter is a simple filter to implement. Read all the color values at the same position in each PPM file, sort them, and then write out the middle value to the filtered image file.
This assignment uses the PPM image format since it is a text-based format. Students only need basic text processing skills in order to read the image files. The assignment requires students to process multiple files to achieve a result, providing an alternative to the often used pattern of one file in and one file out.
Here are nine sample images of a sculpture on the APSU campus with a tourist moving around irritating the photographer. Click for higher resolution images.
The nine images above were filtered and combined using the median filter. The final result, converted to PNG for browser display:
No pesky tourist!
| Summary | The Pesky Tourist -- Combine multiple photographs containing a static object such as a statue or sculpture into a single image. The photos are cluttered with one or more tourists who keep ruining the photos. The final result shows the desired object without any people in the image. The project requires students to read and parse multiple text-based image files and to use arrays to hold the intermediary results. Mathematically, it only requires an understanding of how to find the median of a list of numbers. |
| Topics |
Reading and writing text files Managing and parsing multiple text files Arrays Sorting Basic programmatic directory structure navigation Basic image processing techniques |
| Audience | Appropriate for CS2 or a later course. |
| Difficulty | This is an intermediate assignment, taking 1 week for a CS2 student. |
| Strengths |
Requires students to tackle a real-world problem using text-based files and arrays.
Gives instructors a chance to discuss algorithm choices with students. Most students will want to read an entire source image into memory, before going on to the next image. Instructors can point out that all the input images can be opened at once, and can be processed on a per pixel basis. Pixel colors can be read one at a time for a coordinate (x, y) from each file, and processed before moving on to the next pixel. This will make the code easier to write than trying to manage multiple arrays in memory. The concept is language independent. This assignment can be used with C++, Java, Python, etc. Students can be given the option to create their own input images. |
| Weaknesses | Reading from multiple files and maintaining the correct position in the files can be difficult for students to understand at first. It is probably necessary to work though a sample in class. |
| Dependencies |
Requires an image viewer that understands the PPM format.
Traditional viewers include
Since these programs are big and complex, I wanted an easier way for the students to view the images. I have been experimenting with a simple HTML/JavaScript file that can open and read PPM files. Students are given the file ppmReader.html. The file is placed locally on the student's computer, and allows them to view PPM files. The code does not currently support all possible PPM options, but is easily modified. This file is not specific to this assignment, and can be used on any PPM-related project as an alternative to the programs above. It requires a modern browser, such as Firefox, Chrome, Safari, etc. |
| Variants |
The assignment can be simplified by only using 3 input images. This way the student only needs to find the
middle value of three numbers.
Nothing about this assignment explicitly requires using PPM. For advanced students, you may want to explore using image libraries such as the Python Imaging Library (PIL) for Python or Java Advanced Image (JAI) API. As written here, there is no user interface; it is only a file-based project. You could add user interface elements such as choosing the directories with only certain files or displaying the final result. This will require more knowledge of a language's GUI library. |
In order to create a photo set that leads to successful results, here are some helpful tips:
I have included Java code that the instructor can use to convert JPG, BMP, GIF, or PNG images to the PPM format. The code ensures that the red, green, and blue values for a pixel are all on one line in the resulting PPM file, rather than one long stream of numbers. The structure seems to help students understand the PPM file format.
A sample write-up to use as a starting point