The following image is "live" -- click on it to see what happens. Then think about how you might use this tool in material for mathematics instruction.
This "image" has two parts: a static image (the map), for which you can substitute any image you like, and a "Lite Applet" called Image_and_Cursor, which we will describe in more detail in the following pages. Our goals are
Frank Wattenberg and Bart Stewart are at the United States Military Academy. Suzanne Alejandre is at The Math Forum at Drexel .
Lite applets are flexible and powerful tools that can be used as part of highly interactive curriculum modules that are scientifically and pedagogically sound. The power and flexibility of lite applets are based on three ideas:
Image_and_Cursor is the first entry in the Lite Applet Collection, an open source collection housed in MathDL. All the files used in this article, including the Java source code files, are freely available and may be downloaded for your own use. Links are provided throughout the article and on our Resources page. We invite you to submit your own lite applets and modules to be considered for inclusion in this collection. Contact any of the authors for further information. We expect to add new lite applets and new modules using those applets to the collection regularly.
The following image is "live" -- click on it to see what happens. Then think about how you might use this tool in material for mathematics instruction.
This "image" has two parts: a static image (the map), for which you can substitute any image you like, and a "Lite Applet" called Image_and_Cursor, which we will describe in more detail in the following pages. Our goals are
Frank Wattenberg and Bart Stewart are at the United States Military Academy. Suzanne Alejandre is at The Math Forum at Drexel .
Lite applets are flexible and powerful tools that can be used as part of highly interactive curriculum modules that are scientifically and pedagogically sound. The power and flexibility of lite applets are based on three ideas:
Image_and_Cursor is the first entry in the Lite Applet Collection, an open source collection housed in MathDL. All the files used in this article, including the Java source code files, are freely available and may be downloaded for your own use. Links are provided throughout the article and on our Resources page. We invite you to submit your own lite applets and modules to be considered for inclusion in this collection. Contact any of the authors for further information. We expect to add new lite applets and new modules using those applets to the collection regularly.
Here again is the dynamic image from our front page. An example of its use may be found in Distances in Afghanistan, a student-ready module suitable for students in middle school through college who are studying distance or the Pythagorean Theorem. However, our point is not to show you our uses, but rather to get you to create your own.
You can use Image_and_Cursor in a curriculum module just like you would use an image. But this applet gives you more power than an ordinary image. If you click anyplace on the image, the cross hairs move to the point at which you clicked, and its coordinates appear at the upper right. You can fine-tune the position of the cross hairs by clicking on the four arrows -- above, below, to the left, and to the right of the image.
The applet can be used in many different ways in many different curriculum modules. For example -- as in Distances in Afghanistan -- students studying distance or the Pythagorean Theorem could determine the distance between Kabul and Kandahar by finding the coordinates (in pixels) of the two cities, applying the relevant formula, and then using the scale at the bottom of the map to determine the distance in either miles or kilometers. Or, a calculus instructor might introduce the idea of approximating the length of a curve using a polygonal path by asking students to determine the length of the border between Afghanistan and Iran.
Here is the HTML code for including this live image in a web page:
The color coding shows the four parameters that control the applet window (yellow) and the three that control the background image (violet). These are explained in more detail in the one-sheet instructions for this simplest use of the Image_and_Cursor applet, which you may open in a browser window or download as a Microsoft Word file file. In addition, you will need the following files to use this applet:
Save these files in the same directory as the HTML page in which you will use them. For practice, try this page. [That link will open another copy of this page in a frame that will not include extraneous JOMA codes.] There are several ways you can save an HTML page in a form that allows editing, depending on your operating system and browser. If you right-click in the text of the new copy (command-click on a Mac), you should see a menu that lets you select View source or something equivalent. The HTML source code will appear in whatever text processing program you use -- for example, Notepad on a Windows machine or TextEdit on Mac OS X. The code can be edited and saved in the application that opened it. You can also copy and paste selected portions of this file into HTML pages created with an HTML editor such as Dreamweaver or Front Page.
Lite applets can be easily customized. For example, it is easy to substitute another map or image by changing the file name in the backdrop_filename parameter and the dimensions of the both the applet and the image. Try it!
In the next section we discuss how to use lite applets with a spreadsheet or computer algebra system.
This live image looks very similar to the one in the preceding section except that, by changing a few of the parameters calling the applet, we have created three new buttons that enable the user to copy data into a spreadsheet (or a computer algebra system). In this form, the Image_and_Cursor applet might be used in a module that would lead students to discover how to estimate the length of a complicated curve, such as the border between Afghanistan and Iran. If you have Excel or another spreadsheet on your computer, you might try this:
The Border Between Afghanistan and Iran is a student-ready module using this image and applet as we have just described.
The HTML code shown here illustrates how the Image_and_Cursor applet is called on this page. There are just a few changes from the applet call in the preceding section.
To practice using the applet in this way, you will need to follow a procedure similar to that in the preceding section. First, you need two brief instruction pages:
Next, you need a copy of this page. [That link will open another copy of this page in a frame that will not include extraneous JOMA codes.] Right-click in the text of the new copy (command-click on a Mac), select View source (or equivalent), and save in the directory of your choice. Again, the code can be edited and saved in the application that opened it or in an HTML editor such as Dreamweaver or Front Page. Finally, you need the following files, and they should be placed in the same directory as the HTML page.
Now try creating your own student exercise with and image of your choice and a computational assignment that will make use of Image_and_Cursor data in a spreasheet or a computer algebra system.
The next section shows how lite applets can be used together with forms and Javascript to create even more interactive modules without writing Java programs.
In this section we look at how the Image_and_Cursor applet can be used together with HTML forms and Javascript to create highly interactive modules -- in particular, to create modules in which students can check their work by seeing the results rather than by looking up answers in the back of the book. The best way for you to start is by working through the instructions in the student-ready module, Describe the Squirt . If you want to cut to the chase without working through the problem, try pasting the following answers into the form on that page:
The following three brief documents explain how this module was created.
Complete documentation for the Image_and_Cursor applet is contained in the User's Manual. This applet is very flexible. Included among its features are controls for:
Because most parameters have the most commonly used options set as default values, most curriculum developers will need to specify only a few parameters. For complete documentation see the User's Manual.
We continue in the next section with another module that uses this applet to study the shell of a chambered nautilus.
This example is adapted from the module The Equiangular Spiral at the Connected Curriculum Project, which was published in Volume 1 of JOMA. In this variation the student uses an interactive Excel spreadsheet to fit an exponential function in polar coordinates to measurements made on a picture of a cross-section of a chambered nautilus shell. Then the student types the results into a form to see the curve superimposed on the shell.
As we did on the preceding page, we will start by opening a new browser window, this time with a simplifed version of The Equiangular Spiral. You can carry out the instructions in that page to see how a student might proceed. The Excel worksheet is opened from a link in the module page -- you can paste your own data into the worksheet, but sample data points are recorded there already. Of course, for student use, you would remove the sample data. Start now .
Notice the power that this combination of a lite applet and Excel gives to students to investigate questions of their own. For example, students might wonder about the relationship between the volumes of successive chambers in the shell. They could investigate this by making various measurements on each chamber. If it appeared that the linear measurements seemed to follow a pattern, they might make an assumption about the missing third dimension and, based on that assumption, make a conjecture about the relationship between the volumes of successive chambers.
A new version of the complete Connected Curriculum Project module, The Equiangular Spiral, makes use of the Image_and_Cursor applet in much the same way as described here.
In closing, we repeat the three principles underlying the Lite Applet Collection:
The Lite Applet Collection is open source. All the files used in this article, including the Java source code files, are freely available (see below). We invite you to submit your own lite applets and modules for consideration for inclusion in this collection. We expect to add new lite applets and new modules using those applets to the collection regularly.
The Lite Applet Collection page describes all the applets currently in the collection and includes links to all the associated resources. For your convenience, we include here links to individual resource items mentioned in this article, as well as to other modules that have been based on the Image_and_Cursor applet and other resources related to this applet.