1. James A. Rome TGA August 2009 Mapping the TZs

2. In Java it is quite easy to do maps The only way to tell if we interpolated the data successfully is to plot it. We will see that we can use canned jar (Java archive) files to do most of the work We will use our ZOB48 project too… We will learn how to create a simple graphical user interface (GUI). In Java, it is as easy (or easier) to create a GUI for a program than to do things on the command line Create a new Java Desktop Application Call it MapApp Create a package called mapapp

3. The GUI for MapApp I followed the tutorials at: http://today.java.net/pub/a/today/2007/10/30/building-maps-into-swing- app-with-jxmapviewer.html http://today.java.net/pub/a/today/2007/11/13/mapping-mashups-with- jxmapviewer.html These use the JXMapViewer which you can get from http://www.swinglabs.org/ http://www.swinglabs.org/ except that the site is almost always busy. Good thing I managed to download the files for us. We do not have to understand all of this API, so long as the code in the examples works.

4. Create the new project

5. GUI design Get rid of the status panel Click it in the Inspector and hit Delete. Also in the inspector Right-click mainPanel, Set Layout, Border Layout Make the Whole panel bigger

6. Delete the status bar code Click the Source button in MapView.java. You will see many errors (red bars on the right margin) Delete all the code in the constructor after initComponents(); Delete the 5 associated variables at the bottom of the class Right-click the imports and select Fix Imports to remove those used by the status bar code Save the Project (Ctrl-s)

7. Border Layout A LayoutManager controls the placement and size of Swing objects when the GUI is resized. Any Swing Container can have a LayoutManager Center takes any space left over after the other panes are made just big enough to hold their components. You do not have to use all of the panes North South East Center

8. Start building the GUI In the Palette, click Panel and drag it to the center of the gray area Right-click it and rename it to mapPanel. It is always smart to rename the Swing objects so that you can refer to them easily in your code the bottom-right Property Inspector, be sure that the Layout Direction has mapPanel in the Center Right-click mainPanel and add a second panel. Rename it controlPanel, and set its Layout Direction to South

9. Control Panel Layout Give the ControlPanel a GridLayout with 2 Columns and 1 Row (hit enter after editing any number in the Properties Panel to make it stick) Add two more panels in the controlPanel by right-clicking it in the Inspector Call them leftPanel and rightPanel Notice that they each have the same size inside controlPanel We are aiming for a GUI that looks like the picture at right. In the leftPanel the white rectangles are TextFields; the black text are Labels. The oval is a button

10. Fill the leftPanel Drag components from the Palette (top-right) into the leftPanel. Notice that blue auto alignment and anchor marks appear to help you Select the leftPanel and under border, pick TitledBorder Label it Center Lat/Lon Make it bold (or colored)its you GUI You can select multiple items (using shift-click), and then right- click to select Same Size, Width, to make the TextFields the same size Be sure to rename all the elements as shown

11. Fill in the rightPanel Again use a titled border We will use a List (JListBox) to display the flights Again, rename everything Do initialize the two textFields to the lat/lon over Ohio

12. Add the JXMapViewer JARs Unzip swingx-ws-1.0-bin.zip Copy the extracted lib folder and swingx-ws-1.0.jar to a new lib folder of the MapApp project There are many ways of doing this, and I was fighting bugs: in Tools, Libraries, add a New Library Call it JXMap Navigate to the project lib folder and add all the jars in lib/cobundle, lib/optional, and swingx-ws-1.0.jar

13. Add the Library to MapApp Right-click MapApp (in the Project Pane), and select Properties. Under Libraries, click Add Library Navigate to JXMap and import it.

14. Also add our ZOB48.jar Again, use the Library Manager to make a ZOB48 library that contains the ZOB48.jar file in the ZOB48/dist directory Add it to MapApp Now we can use the tools we have already built!

15. Drag JXMapKit to the GUI Clean and build the project Drag the JXMapKit class to the top pane of your GUI rename it flightXMapKit resize it to fit the upper window (maybe with a small margin). Change the Default Provider to OpenStreetMaps Try building and running the GUI

16. Fix the MapView constructor Coords in ZOB48bndry.txt

17. Add Actions to the buttons In Design View, right click each button and add an actionPerformed event The GUI will pop into Source View to show you where to enter the code for the action There will be errors still, (more code to come) Keep right-clicking and do Fix Imports to get rid of the missing imports. Note: I copied a lot of this code from the tutorial

18. The drawing code

19. Play with it Try examining the course for many of the flights to get a feel for the ZOB48 traffic Not all flights are in ZOB48 There is a lot of East- West traffic The sector extends (a bit) into Canada