Using GeoGebra To Create Interactive Web Content Dave Matthews Minnesota West Community and Technical College dave.mattthews@notropis.net Video Tutorials and Examples at: http://notropis.net/geogebra Geogebra Home: http://www.geogebra.org

What is GeoGebra? Free Java-Based Dynamic Mathematics Software

Where’s it from?

What can it do? Static Images for Export to PowerPoint, Windows, LodeStar or to Print

Interactive Applets for Classroom Demonstration

Dynamic Web Pages For Student Explorations

Simple point-and-click constructions Graphics/Text/Image Integration Support for Geometric Constructions and Transformations Complete Graphing Calculator Capabilities Fairly Extensive and Growing CAS Full Conic Section Support One-Click Web Page Authoring Platform Independent, Java-Based, No Plug-Ins Customizable Toolbars Construction Protocol (Frames) Option Open Source (GPL License, NSF Supported) Extensive Built-In Help Active Wiki Community Free, Fully Functional Application Available On Any Computer with a simple double-click option

Enough Advertising, let’s do it already! Go to http://www.geogebra.org Click “Start GeoGebra” Click “GeoGebra Webstart” Tutorial available at: http://notropis.net/geogebra/VideoTutorials.html 1. Downloading GeoGebra and getting started

Task #1: Make some blank graph paper, with axes, and export it to Microsoft Word (or similar)

Webstart guarantees the latest stable version Right-clicking on any object brings up the “properties” option To copy the current contents of the drawing pad to the clipboard, do: “File -> Export -> Export Drawing Pad To Clipboard Contents can then be pasted into Word, or PowerPoint or wherever

Create a picture, using the tool buttons, and the text boxes Task #2 Create a picture, using the tool buttons, and the text boxes Try to include: Angles Colors Text No axes or grid, when you’re done (See http://www.notropis.net/geogebra/VideoTutorials.html 2. Making a right triangle, for a similar example)

My example:

Most tools create points as needed, or use existing ones, depending on where you click Use the axes and the grid as guides to place your objects, then hide them later As objects are created on the Drawing Pad, they are listed in the Algebra Window (except text objects) To change the properties of an object, you can either right-click on it on the Drawing Pad or in the Algebra Window Text boxes are objects, and can be moved around on the drawing pad after being created. To change their properties, you must right-click on them on the Drawing Pad.

Make a dynamic right triangle Task #3 Make a dynamic right triangle Allow all the vertices to be adjustable Constrain their motion so that you always have a right triangle Rename the objects so that the right angle is called “C” Show the location of the right angle using the angle tool Hide the objects that were needed for construction, but you don’t want seen on the triangle (See http://www.notropis.net/geogebra/VideoTutorials.html 3. Making a “dynamic” right triangle, for an example)

Placing a point on a line, curve or axis restricts that point’s motion to the line, curve or axis. Lines can be defined algebraically, using the input field, or geometrically, using the line tool. Objects can be renamed by right-clicking and naming. Objects can be hidden, by right-clicking and deselecting the “show object” property

Task #4 Making Dynamic Text Create a dependent object, made up of several free objects Create a text box that contains both static text and dynamic text – text that changes as the value of some object changes Link the text box to an object, so that when the object moves, the location of the text moves with it (See http://www.notropis.net/geogebra/VideoTutorials.html 4. Working with dynamic text, for an example)

The default assumption is that text is static The presence of quotation marks in a text box is the signal that what is inside the quotes is static text, while what is outside refers to some already named variables Dynamic text reflects the value of the variable, not its name To begin with dynamic text, start with an empty string, “” Plus symbols connect static text via “concatenation” An example is worth a thousand bullet points: If there was a line segment named “c” of length 5, and you typed into the text box: “The length of segment c is ” + c You’d see: The length of segment c is 5 And when you change the length of “c”, the number 5 would change accordingly. GeoGebra will attempt to operate on variable values within a text box. “” + b*c will attempt to multiply the values of variables b and c The location of the text box can be hooked to an object by using the “position” property

Task #5 Making and Exporting Dynamic Web Pages Take the dynamic object, with dynamic text that you created in Task #4, and export it to a folder on your computer as a dynamic web page. Add some text above and below the Java applet on the web page. Make the applet “double-clickable” to open the full application Find the two files created in your folder that will need to be uploaded to your web site (See http://www.notropis.net/geogebra/VideoTutorials.html 5. Making and exporting dynamic web pages, for an example)

Be sure that the Drawing Pad is exactly the size you want it to be, before exporting. Decide whether you want the Algebra Window showing or not, before exporting. Remember that you don’t want the Java applet too big on the web page (some people have lower resolution monitors!) File -> Export -> Dynamic Worksheet As Web Page Be SURE to check the advanced options Double-Click Opens Application Window Java Applet archive= etc. Checked insures that the applet will find the GeoGebra .jar file stored at www.Geogebra.org Remember to upload BOTH the .gbb file, and the .html file

Functions, If/Then/Else, Task #6 Functions, If/Then/Else, Trace,Sliders Define a function using f(x)= in the input field Make a multi-part function using the If command Change some parameter on the function using a slider object Use the “trace on” property of a point (See http://www.notropis.net/geogebra/VideoTutorials.html 6. The input field, functions and if/then/else, for an example)

Functions are designated by the (x) = in the name, e. g Functions are designated by the (x) = in the name, e.g. Foo(x)= would be the function known as “Foo.” GeoGebra has an extensive library of built in functions. See the documentation under “help” for a complete list. Axes can be scaled by grabbing and dragging using the “Move Drawing Pad” tool If[condition,do] is an “If/Then;” If[condition,do,else] is an “If/Then/Else.” If’s can be nested: If[condition,do,If[condition,do,else]], etc. Slider variables can be created, then used to define other objects: create slider variable k, then f(x)=k*x will change its slope as you slide the value of k back and forth. “Trace on” for a point paints a trail of where the point has been

Task #7 Importing Images Make a dynamic web page using some of the knowledge you’ve picked up today, that incorporates an image you’ve imported off of the web or from your computer. Play around with some features we haven’t covered. Be prepared to share your knowledge and questions, if not your final result.

Thoughts? Comments? Questions?

Topics for another day: Construction Protocols Lists Check Boxes (“Booleans”) Conditions for Visibility Statistical Functions Curve Fitting Computer Algebra System (Integral, Derivative, etc.) Customizable Toolbars

Using GeoGebra To Create Interactive Web Content http://notropis.net/geogebra http://www.geogebra.org dave.matthews@notropis.net