GeoGebra NA2010
July 27-28 2010
Ithaca College, Ithaca, NY, USA
Communicating Effective Ways of Teaching and Learning Dynamic Mathematics –
Building and Maintaing a “Community of Practice/Inquiry”
EMBEDDING GEOGEBRA APPLETS IN WEBWORK HOMEWORK
MICHAEL E. GAGE
1
University of Rochester, Rochester, NY, USA gage@math.rochester
Abstract: We describe how to embed GeoGebra applets into a WeBWorK homework question using methods similar
to those used to embed them into a wiki page. The combination of GeoGebra applets and online questions that
provide instant feedback for mathematically complex questions gives powerful motivation and support for learning
mathematical concepts. It can be even more effective when small teams of students work on the questions together.
The WeBWorK environment provides persistence – the applet remains just as the students left it if they interrupt
their work session and then return; variety – each student or team receives a different version of the problem; and
most importantly instant feedback to questions – this very important feature motivates students to keep working,
warns them if they have gone wrong somewhere and reassures them if they are on the right track.
Keywords: GeoGebra, WeBWorK, homework
INTRODUCTION
WeBWorK is an open source on-line homework system widely used at many universities and
colleges for precalculus, calculus and higher mathematics courses. Many high schools have also begun to
use it for AP mathematics and statistics courses.
The immediate feedback provided by the computer has proved to be a powerful motivating force for
encouraging students to take their homework seriously. By automatically checking answers and
recording the results WeBWorK saves grading time on routine questions and allows instructors to
concentrate on more productive interactions with students. A surprisingly large fraction of the standard
high school and undergraduate mathematics questions (excepting essays and proofs) can be presented and
automatically graded using WeBWorK.
Combining this powerful question engine with GeoGebra or other applets provides the visual aspect
that is missing from text alone, helping visual learners and reinforcing the importance of visual
representations for all students.
In principle it is possible to program extensive interactions between the GeoGebra applet and the
questions using the javaScript language. In this paper we limit ourselves to describing the simpler task
of transferring a free standing Geogebra applet to a WeBWorK question so that (1) its state is preserved
from one viewing to the next (i.e. the homework remains just as the student left it) and so that (2) the
parameters of the applet and the surrounding questions can be set differently for each student.
1
Author partially supported by NSF grant DUE- 0920341
GeoGebra NA2010
July 27-28 2010
Ithaca College, Ithaca, NY, USA
EMBEDDING GEOGEBRA IN WEBWORK QUESTIONS
It’s usually best to first develop the GeoGebra applet and the surrounding WeBWorK questions
separately and then combine them. We’ll assume that you are familiar with GeoGebra and with editing
an ordinary WeBWorK question and limit this paper to a description of how to combine the two.
Complete descriptions of the capabilities of the two software systems are beyond the scope of this paper
but can be found at http://www.geogebra.org/ and http://webwork.maa.org/ respectively where one can
find descriptions, tuturials, forums and video presentations of describing these systems. The best method
for learning to write GeoGebra/WeBWorK applets is to start with existing examples and modify them to
suit your purposes.
Given a WeBWorK question and a free standing GeoGebra applet, either prepared in the GeoGebra
application or copied from a webpage, we need to cut and paste the appropriate parameters from the
GeoGebra applet and paste them into the WeBWorK question. If you are new to working with HTML
first take a look at the instructions at http://geogebrawiki.wikispaces.com/Embed+GeoGebra+Worksheet
for embedding a worksheet in a wiki page. The method for embedding into WeBWorK differs very
slightly from this because we want WeBWorK and GeoGebra to interact. WeBWorK uses only some of
the parameters from Geogebra and sets a few parameters in a different location.
INSERTING THE GEOGEBRA PARAMETERS
Starting with the GeoGebra application, choose “Export” and save the resulting html file where you
can find it. View it with a text editor, or view it with a web browser and choose “View source” from the
web browser menu. Find the section describing the applet – this section begins with <applet> and ends
with </applet>.
If you start with an applet already embedded in a webpage, simply “view source” and find the applet
section.
Select the parameters which begin with
<param name="ggbBase64" value="UEsDBBQACAAIAOCc5TwAAAAAAAAAA.........
...... and continue to just above the end tag ............
</applet>
Save this text somewhere where you can retrieve it later.
GeoGebra NA2010
July 27-28 2010
Ithaca College, Ithaca, NY, USA
There are some boiler plate sections that need to be inserted into WeBWorK. We can grab these from
an existing example such as ship problem which uses an applet designed by Prof. Linda FahlbergStojanovska.
Search for the GEOGEBRA_PARAMS subroutine section at the end of the ship problem file and
paste it into to your WeBWorK file just above the ENDDOCUMENT(); command. Next paste the saved
text with the GeoGebra parameters into the section between the two comment lines (#######),
replacing the parameters from the ship problem. When you are done the GeoGebra parameter section of
the WeBWorK file will look something like this:
# put the parameters defining the geogebra applet down here so they
# don't get in the way
sub GEOGEBRA_PARAMS {
$result = qq{
<param name="ggbOnInitParam" value="$appletName"/>
############################
<param name="ggbBase64" value="UEsDBBQACAAIAOCc5TwAAAAAAAAAA.........
....DAOgAAADKdwAAAAA=" />
<param name="image" value="http://www.geogebra.org/webstart/loading.gif" />
......... more parameters .............
<param name="showToolBarHelp" value="true" />
<param name="showAlgebraInput" value="false" />
<param name="allowRescaling" value="true" />
#########################################
};
}
ENDDOCUMENT();
The value of the ggBase64 parameter is a long string of letters that describes the configuration of the
GeoGebra applet. The other parameters are somewhat self explanatory. The parameter ggbOnInitParam,
which is in the original template and is not copied from the original GeoGebra applet, allows GeoGebra to
tell WeBWorK when it is loaded and ready to go. Be careful to preserve the closing curley braces, the
ENDDOCUMENT() command and the semi-colons just as they are.
Next find the section towards the beginning of the ship problem template which looks like:
##################################
# Create link to applet:
###################################
# You can name your applet (anything reasonable :-) )
# Adjust the height and width as desired
# Paste the geogebra parameters in at the bottom of the page just above the
# command end command
# so that they don't get in the way
###################################
$appletName = "shipGeogebra";
$applet = JavaApplet(
code
=> "geogebra.GeoGebraApplet",
archive => "geogebra.jar",
codebase => findAppletCodebase("geogebra.jar"),
appletName => $appletName,
........ more parameters defined here ..........
getStateAlias
=> 'getXML',
setConfigAlias
=> '',
getConfigAlias
=> '',
GeoGebra NA2010
July 27-28 2010
Ithaca College, Ithaca, NY, USA
returnFieldName
=> '',
width
=> 844,
# may want to modify width
height
=> 456,
# may want to modify height
mayscript
=> "true",
debugMode
=> 0,
# set debugMode to 0 for no debug
# to 1 to make xml representation visible
# to 2 to add alerts detailing progression
# through the applet
onInit
=> 'ggbOnInit',
type
=> 'geogebra',
parameter_string
=> GEOGEBRA_PARAMS(),# paste parameters in section at the bottom
);
##################################
# Setup Geogebra applet -- this does not need to be changed
###################################
HEADER_TEXT(qq!
<script language="javascript">
function ggbOnInit(param) {
if (param == "$appletName") {
applet_loaded(param,1); // report that applet is ready.
ww_applet_list[param].safe_applet_initialize(2);
}
}
</script>
!
);
Be sure to grab the final parentheses and the semi-colon.
There are three adjustments that should be made in this section, naming the applet, and defining its
height and width. Replace “shipGeogebra” at the top of this section with a name for your applet, the name
can contain letters, numbers and under bars but not spaces. The variable $appletName now contains the
applet name and will supply this throughout the rest of the WeBWorK script where ever $appletName
appears. Next change the width and height parameters to conform to the parameters of the original free
standing GeoGebra applet. This code is read directly by the computer so it’s important that care be taken
not to change line endings. Leave the commas and semi-colons at the end of lines just as they are in the
template. If warning messages occur when viewing the WeBWorK page it usually indicates that a
comma or semi-colon has been omitted or misplaced. To obtain extra information while testing the applet
the debugMode can be set to 1 to display the applet state and to 2 to step through the initialization
procedure. For normal use set the debugMode to 0. Notice that the symbol “=>” is used rather than “=”
in this section to assign values to parameters.
Finally grab the section
###################################
#insert applet into body -- this does not need to be changed
# except to adjust the insertion of the reinitialize_button or
# a hidden AnswerBox
###################################
GeoGebra NA2010
July 27-28 2010
Ithaca College, Ithaca, NY, USA
TEXT($PAR, MODES(TeX=>'object code', HTML=>$applet->insertAll(
debug =>0, reinitialize_button => 1, includeAnswerBox=>0,
)));
and insert it at the point where you wish the applet to appear – often before the first
BEGIN_TEXT/END_TEXT section, or perhaps between two such sections. Nothing needs
to be changed in this section.
At this point you can test the applet. It should save its state – i.e. if you manipulate the applet and
submit the WeBWorK question the applet should reappear in the same configuration as when you
submitted the question. There is a “Return this question to its initial state” button if you wish to start
over.
SETTING THE INITIAL VALUES IN GEOGEBRA FROM WEBWORK
For our final task we’ll set WeBWorK to initialize the controlling variables in the applet so that each
student can obtain a different version of the problem. In the ship problem file find the javaScript section
which looks like
###################################
# JavaScript section
# Set the configuration in geogebra
# Set the speed variables vE and vN to the speeds defined above
# The code below is written in javaScript and uses the geogebra javaScript interface
# Comments use // in javaScript instead of #
###################################
TEXT(qq{
<script language="javascript">
function setAppletCoefficients() {
var applet=getApplet("$appletName"); //alert("Updating coefficients");
if (typeof(applet)!="undefined") {
if (typeof(applet.setValue)!="undefined") {
////////////////////////////////////////////////////////////////
// List the values of the parameters to be set in the applet here
////////////////////////////////////////////////////////////////
//
//
applet.setValue("vE", $e_speed);
applet.setValue("vN", $n_speed);
/////////////////////////////////////////////////////////////////
} else {
setTimeout("setAppletCoefficients()", 1000);
}
} else {
setTimeout("setAppletCoefficients()",1000);
}
}
ww_applet_list["$appletName"].setConfig = function() {setAppletCoefficients()};
</script>
});
and insert it after the applet insertion section.
Much of this code is boiler plate and does not need to be changed (we’ll hide the details in future
versions of this API). The key lines are
applet.setValue(“vE”, $e_speed);
applet.setValue(“vN”, $n_speed);
GeoGebra NA2010
July 27-28 2010
Ithaca College, Ithaca, NY, USA
These commands tell WeBWorK to set the GeoGebra variable vE to the value of the webwork
variable $e_speed defined in the WeBWorK setup section. Similarly vN is set to the value of $n_speed.
Uncomment these commands by removing the javaScript comment characters // from the beginning
of the line. You can replace lines with commands that set the defining variables of your applet. For
experienced GeoGebra designers nearly every aspect of GeoGebra can be set by placing the appropriate
javaScript command in this section. See the GeoGebra javaScript page for the available commands.
CUSTOMIZING THE WEBWORK QUESTION.
That’s it. You can change the wording that appears on the WeBWorK page by editing the material in
the BEGIN_TEXT/END_TEXT sections. By checking frequently you can see what is being affected. The
setup section at the top of the file is where the initial variables and the formulas for the problem are
defined. You can reset $e_speed and $n_speed to new values or you can set them to
# $e_speed = Real( random(3,30,1) ); # choose random integer between 3 and 30
# $n_speed = Real( random(3,30,1) );
which will give each student a different speed between 3 and 30. Notice how the GeoGebra applet
changes when you do this.
It’s best to make very small changes and test frequently to see what happens, particularly while you
are learning the system.
If you have questions or have difficulties there is a very active WeBWorK forum attached to
http://webwork.maa.org where WeBWorK questions at all levels of sophistication are answered, many of
them within hours and most within a day or two. Often you can find answers even without posting a
question by searching the forum for previous explanations.
SUMMARY
Online homework is being increasingly utilized at colleges and universities. [5,6]. Studies have shown
that such homework, used together with other interventions to promote active engagement with the
mathematical material can have a significant effect on learning as measured by grade point averages.[7-10]
Combining standard written questions with interactive applets seems a good candidate for providing even
more support for mathematical learning. Fortunately the addition of GeoGebra applets to WeBWorK
questions is not difficult in many cases. The hard part is creating the right applet design and crafting
“good questions”.
Further development of the GeoGebra – WeBWorK application interface (API) will facilitate the
specification of how WeBWorK and GeoGebra interact including additional methods for allowing
WeBWorK to check GeoGebra constructions for correctness and to notify the student.
GeoGebra NA2010
July 27-28 2010
Ithaca College, Ithaca, NY, USA
8. REFERENCES AND RESOURCES
[1] http://webwork.maa.org/, Home for WeBWorK at the Mathematics Association of America.
[2] Gage, Michael E., WeBWorK course containing math questions with embedded applets.
http://hosted2.webwork.rochester.edu/webwork2/2010geogebra_at_ithaca.
[3] MAA 101—110 courses
[4] Fahlberg-Stojanovska, Linda, Embedded wiki version of the ship applet.
[5] Fahlberg-Stojanovska, Linda, Embedding GeoGebra worksheets into a wiki page.
[6] Elaine Kehoe, AMS Homework software survey, Notices of the AMS, June 2010.
[7] James Lewis and Alan Tucker, Report on the AMS First-Year Task Force, Notices of the AMS, June
2009.
[8] Dedic, H., S. Rosenfield, I. Ivanov. 2008. Online assessments and interactive classroom sessions: a
potent prescription for ailing success rates in Social Science Calculus. 210 pages.
http://sun4.vaniercollege.qc.ca/PA-2005-008
[9] Hirsch, L. and C. Weibel. 2003. Statistical evidence that web-based homework helps. MAA Focus.
23: 14. (summary of results in [7])
[10] Weibel, C. and L. Hirsch. 2002. WeBWorK effectiveness in Rutgers Calculus. preprint. 18 pages.
http://www.math.rutgers.edu/~weibel/webwork.html,
[11] David Bressoud, WeBWorK, Launchings, April 2009, with further references to assessment studies,
http://www.maa.org/columns/launchings/launchings_04_09.html
[12] The MAA is able to host WeBWorK course for small and medium size math courses or for instructor
experimentation on their website at https://courses.webwork.maa.org/webwork2 free of charge, at
least for the next few years. To request a course send email from your professional account to
webwork@maa.org and supply the following information:
courseID (e.g. math101)
courseName (e.g. Calculus 1)
institution (e.g. University of Rochester)
instructor_email (e.g. gage@math.rochester.edu)
instructor name (.e.g. Michael Gage)
And a short note explaining the purpose of your request.
Your url will include your school or an abbreviation -- something like: UR_math101
or rochester_math101 usually taken from the domain name of your professional email account.
The instructor's login will be derived from the email (e.g. gage in the example above), unless
you supply a different login to use instead.