Las Matemáticas en Secundaria con
Software Libre
Daniel López Avellaneda
dani@lubrin.org
GeoGebra - Interacción con
JavaScript
Manual para el curso organizado por:
CEP Cuevas-Olula +CEP El Ejido +CEP Almería
http://aula.cepindalo.es
Marzo-Mayo de 2008
ÍNDICE #1/4
Índice
1. Introducción 2
2. Algo de HTML y JavaScript 2
3. Desde JavaScript a GeoGebra 4
Daniel López Avellaneda [http://lubrin.org/mat] http://aula.cepindalo.es
2 ALGO DE HTML Y JAVASCRIPT #2/4
1 Introducción
La verdadera potencia de GeoGebra reside en la creación de applets interactivos. Se trata de
que el usuario no se limite a deslizar variables, sino que, mediante campos de entrada de texto,
botones, etc. pueda introducir datos e interactuar con GeoGebra.
Ello se consigue con JavaScript (lenguaje de programación que se ejecuta en el PC del cliente,
en lugar de en el servidor de Internet).
Para esta parte serían recomendables conocimientos de JavaScript y algo de HTML (sobre
todo lo concerniente a formularios).
Lo que pretendemos es crear pequeños objetos de aprendizaje mediante una página web en la
habrá:
texto explicativo
un applet geogebra
campos de entrada de texto y botones que nos permitan interactuar con GeoGebra.
Mediante los formularios (campos de texto y botones) le enviaremos órdenes a GeoGebra del tipo:
dibuja un punto, mueve un polígono, calcula un área, etc.
2 Algo de HTML y JavaScript
Estamos acostumbrados a ver formularios en la web. Normalmente tienen una serie de campos
de entrada de texto (donde tecleamos los datos solicitados) y suelen terminar con un botón 'Enviar
Datos' que pulsamos cuando hemos completado el resto de campos.
Cuando pulsamos 'Enviar', normalmente el servidor ejecuta algunas acciones o simplemente
nuestros datos son enviados por e-mail. Sin embargo, también es posible ejecutar acciones en
cliente, es decir sin que pase información al servidor donde está alojada la página. Para ello se
suele usar JavaScript, que al ser un lenguaje interpretado en el lado del cliente, no necesita acceder
al servidor para responder a nuestras acciones.
Un simple botón se puede introducir con el siguiente código:
<form>
<input type="button" value="Nombre" >
</form>
Aparecerá un botón en la web, pero no hace nada al pulsarlo.
Si queremos que haga algo al pulsarlo ponemos algo así:
<form>
<input type="button" value="Nombre" onclick="mi_funcion();">
</form>
Le estamos diciendo que al hacer clic sobre el botón, ejecute las órdenes incluidas en mi_funcion().
Pero ¾qué es mi función y dónde está? mi_funcion() va a ser una función de JavaScript parecida
a:
script type=text/javascript
function mi_funcion()
{
alert (' hola ');
}
/script
Daniel López Avellaneda [http://lubrin.org/mat] http://aula.cepindalo.es
2 ALGO DE HTML Y JAVASCRIPT #3/4
Veamos ahora un ejemplo de formularios con javascript, donde le pasamos datos a través de un
campo de texto del formulario.
form name=formu
Su nombre: input type=text name=nombre
input type=button value=Enviar onclick=mi_funcion2();
/form
Previamente debemos haber denido mi_funcion2():
script type=text/javascript
function mi_funcion2()
{
var nom=document.formu.nombre.value;
alert ('Hola ' + nom);
}
/script
Almacenamos en la variable 'nom' el valor del campo de texto 'nombre'. Observe que las palabras
'formu' y 'nombre' son los nombres del formulario y del campo de texto.
Daniel López Avellaneda [http://lubrin.org/mat] http://aula.cepindalo.es
3 DESDE JAVASCRIPT A GEOGEBRA #4/4
3 Desde JavaScript a GeoGebra
Veamos como dar órdenes desde JavaScript a GeoGebra.
Disponemos de un chero ggb (por ejemplo prueba.ggb en el que simplemente hemos dibujado
un cuadrilátero) y del chero html generado automáticamente con GeoGebra. Después del applet
introducimos el siguiente texto:
Pretendemos que GeoGebra dibuje un Punto P=(x,y) después de que el usuario haya introdu-
cido las coordenadas x e y, mediante campos de texto de un formulario.
En le formulario ponemos dos entradas de texto (una para x y otra para y) y botón para hecer
clic una vez tecleadas ambas coordenadas.
En la función de JavaScript almacenamos en applet geogebra en la variable geo y las coorde-
nadas introducidas por el usuario en las variables x e y.
Finalmente usamos la orden EvalCommand de GeoGebra.
EvalCommand(lo_que_sea) hace lo mismo que si introducimos lo_que_sea desde la entrada
algebraica de GeoGebra.
Actividad: Genere una web con un applet geogebra que dibuje una parábola ax
2
+bx+c=0, donde
los coecientes a, b y c deben ser introducidos por el usuario mediante campos de texto de
un formulario.
Daniel López Avellaneda [http://lubrin.org/mat] http://aula.cepindalo.es

Geogebra interacción con javascript

  • 1.
    Las Matemáticas enSecundaria con Software Libre Daniel López Avellaneda dani@lubrin.org GeoGebra - Interacción con JavaScript Manual para el curso organizado por: CEP Cuevas-Olula +CEP El Ejido +CEP Almería http://aula.cepindalo.es Marzo-Mayo de 2008
  • 2.
    ÍNDICE #1/4 Índice 1. Introducción2 2. Algo de HTML y JavaScript 2 3. Desde JavaScript a GeoGebra 4 Daniel López Avellaneda [http://lubrin.org/mat] http://aula.cepindalo.es
  • 3.
    2 ALGO DEHTML Y JAVASCRIPT #2/4 1 Introducción La verdadera potencia de GeoGebra reside en la creación de applets interactivos. Se trata de que el usuario no se limite a deslizar variables, sino que, mediante campos de entrada de texto, botones, etc. pueda introducir datos e interactuar con GeoGebra. Ello se consigue con JavaScript (lenguaje de programación que se ejecuta en el PC del cliente, en lugar de en el servidor de Internet). Para esta parte serían recomendables conocimientos de JavaScript y algo de HTML (sobre todo lo concerniente a formularios). Lo que pretendemos es crear pequeños objetos de aprendizaje mediante una página web en la habrá: texto explicativo un applet geogebra campos de entrada de texto y botones que nos permitan interactuar con GeoGebra. Mediante los formularios (campos de texto y botones) le enviaremos órdenes a GeoGebra del tipo: dibuja un punto, mueve un polígono, calcula un área, etc. 2 Algo de HTML y JavaScript Estamos acostumbrados a ver formularios en la web. Normalmente tienen una serie de campos de entrada de texto (donde tecleamos los datos solicitados) y suelen terminar con un botón 'Enviar Datos' que pulsamos cuando hemos completado el resto de campos. Cuando pulsamos 'Enviar', normalmente el servidor ejecuta algunas acciones o simplemente nuestros datos son enviados por e-mail. Sin embargo, también es posible ejecutar acciones en cliente, es decir sin que pase información al servidor donde está alojada la página. Para ello se suele usar JavaScript, que al ser un lenguaje interpretado en el lado del cliente, no necesita acceder al servidor para responder a nuestras acciones. Un simple botón se puede introducir con el siguiente código: <form> <input type="button" value="Nombre" > </form> Aparecerá un botón en la web, pero no hace nada al pulsarlo. Si queremos que haga algo al pulsarlo ponemos algo así: <form> <input type="button" value="Nombre" onclick="mi_funcion();"> </form> Le estamos diciendo que al hacer clic sobre el botón, ejecute las órdenes incluidas en mi_funcion(). Pero ¾qué es mi función y dónde está? mi_funcion() va a ser una función de JavaScript parecida a: script type=text/javascript function mi_funcion() { alert (' hola '); } /script Daniel López Avellaneda [http://lubrin.org/mat] http://aula.cepindalo.es
  • 4.
    2 ALGO DEHTML Y JAVASCRIPT #3/4 Veamos ahora un ejemplo de formularios con javascript, donde le pasamos datos a través de un campo de texto del formulario. form name=formu Su nombre: input type=text name=nombre input type=button value=Enviar onclick=mi_funcion2(); /form Previamente debemos haber denido mi_funcion2(): script type=text/javascript function mi_funcion2() { var nom=document.formu.nombre.value; alert ('Hola ' + nom); } /script Almacenamos en la variable 'nom' el valor del campo de texto 'nombre'. Observe que las palabras 'formu' y 'nombre' son los nombres del formulario y del campo de texto. Daniel López Avellaneda [http://lubrin.org/mat] http://aula.cepindalo.es
  • 5.
    3 DESDE JAVASCRIPTA GEOGEBRA #4/4 3 Desde JavaScript a GeoGebra Veamos como dar órdenes desde JavaScript a GeoGebra. Disponemos de un chero ggb (por ejemplo prueba.ggb en el que simplemente hemos dibujado un cuadrilátero) y del chero html generado automáticamente con GeoGebra. Después del applet introducimos el siguiente texto: Pretendemos que GeoGebra dibuje un Punto P=(x,y) después de que el usuario haya introdu- cido las coordenadas x e y, mediante campos de texto de un formulario. En le formulario ponemos dos entradas de texto (una para x y otra para y) y botón para hecer clic una vez tecleadas ambas coordenadas. En la función de JavaScript almacenamos en applet geogebra en la variable geo y las coorde- nadas introducidas por el usuario en las variables x e y. Finalmente usamos la orden EvalCommand de GeoGebra. EvalCommand(lo_que_sea) hace lo mismo que si introducimos lo_que_sea desde la entrada algebraica de GeoGebra. Actividad: Genere una web con un applet geogebra que dibuje una parábola ax 2 +bx+c=0, donde los coecientes a, b y c deben ser introducidos por el usuario mediante campos de texto de un formulario. Daniel López Avellaneda [http://lubrin.org/mat] http://aula.cepindalo.es