CS 251: Assignment #2

Visualization Tools

For this assignment, you will create a graphical user interface [GUI] using python and the Tkinter library. We'll go over the main concepts in class, but they're also laid out for you here. You'll be building your system on top of this program throughout the semester, so take time to comment the code and make sure you understand it.

This project also includes an initial exploration of the matplotlib package, which should enable you to do some quick and easy visualizations.

This project should be done individually.


Before you begin, download the skeleton python file for creating a window and menus using the Tkinter package. Rename the file to display.py or something you like. To run the program, open a Terminal and type the following command.

python display.py

If you're not yet comfortable with Python, there are python books in the Safari Online collection. Work through a few examples so you get a sense for how it works.

There are a number of useful tutorials and documentation sites on Tkinter. You should go through a few of them before continuing with the rest of the assignment.

The code creates the menus and a single button in the window and connects them to empty functions.

  1. In your __init__ method, assign an empty list to the field self.shapes. Then have your right button click function (button 2) generate a shape where the user clicked and add a reference to the shape to your shapes list.
  2. Now enable your left mouse button to move all of the shapes currently on the canvas. The method handleButton1 creates a field self.baseClick that is assigned a list containing the x and y fields of the event. Then in handleButton1Motion, the function calculates the change in mouse position compared to self.baseClick. You need to write the code to move all of the current items in the self.shapes list using the coords function.
  3. Add two more buttons to the frame in the window. Label the three buttons red, green, and blue. The user should be able to select the color of new shapes created by clicking the right mouse button. You'll need a currentColor field in the app object.
  4. Using the StringVar and OptionMenu object, create a popup menu in the same frame as the three buttons Use the popup menu to allow the user to select what shape to create when the user clicks on the window with the right mouse button. Double-check that all of your scrolling still works.
  5. The Open... command in the file menu asks the user to select a file, but does nothing with it. Using this file, have your program put a shape at each location given in the file, where the shape is determined by the current shape option variable you defined in the first task. Each row has two numbers, separated by a comman, that are the x and y coordinates for where to draw the circle.

    Make sure the scrolling with button 1 still works after you implement this capability.

  6. Create a second Open... command that will work with your data from project 1, but only read the data into a list. Then use matplotlib to generate a plot of two axes in your data. You can hard-code which axes to use.
  7. Use the histogram menu option in the Command menu to generate a histogram of a selected axis (you can hard-code which one) from your data. Use matplotlib to create the histogram. The example in the code uses numpy to create a vector of 1000 random numbers and then uses matplotlib (pylab) to generate the histogram.



Make a brief individual writeup of your TK coding. Put in some screen shots of the graphs and your main window. Explain the meaning of the graphs.


Once you have written up your assignment, give the page the label:


Put your code in the COMP/CS251 folder on fileserver1/Academics.