Tutoriel Javascript 6: Animer un point

Fonctions et boutons :

<script type="text/javascript">

var nTimerID = 0;
var vitesse = 100;


function tracecercle()
{
var app = document.ggbApplet;
app.setRepaintingActive(false);
app.evalCommand("O=(0,0)");
app.evalCommand("A=(3,4)");
app.evalCommand("C=Cercle[O,A]");
app.evalCommand("M=Point[C]");
app.evalCommand("s=Segment[O,M]");
app.setLabelVisible('C',false);
app.setLabelVisible('s',false);
app.setVisible('A',0);
app.setRepaintingActive(true);
}

function avance()
{
var app = document.ggbApplet;
n=6.28*Math.random();
cosn=5*Math.cos(n);
sinn=5*Math.sin(n);
app.setCoords('M',cosn,sinn);
}

function CalledByTimer() 
{
// Bouge le point "M"
if (nTimerID == 0) return true;
avance();
}


function Animer(vite) 
{
// Anime le point M

if (nTimerID==0) {
   nTimerID = setInterval('CalledByTimer()',vite)}
}

function moinsvite()
{
vitesse=vitesse+50;
Animer(vitesse);

}

function plusvite()
{
vitesse=vitesse-10;
Animer(vitesse);

}
</script>

<input onclick="tracecercle();" type="button" value="Afficher la figure" /><br />
<input onclick="avance();" type="button" value="Modifier la position de M" /><br />

<input type="button" value="Animer M" onclick="Animer(vitesse);">

<input type="button" value="Stop" onclick="clearInterval(nTimerID);  nTimerID=0;"><br /> 

<input type="button" value="Moins vite (appuyer sur Stop pour continuer de décélérer)" onclick="moinsvite();">

<input type="button" value="Plus vite (appuyer sur Stop pour continuer d'accélérer)" onclick="plusvite();"><br /> 

<input type="button" value="RAZ"    onclick="document.ggbApplet.reset();vitesse=100;
            if (nTimerID !=0) { clearInterval(nTimerID);  nTimerID=0;}"> 

Voir aussi:  

• Mouvement animé
• Utilisation de setTimeout

Tutoriel Javascript 5: Obtenir et modifier les coordonnées d'un point

Sorry, the GeoGebra Applet could not be started. Please make sure that Java 1.4.2 (or later) is installed and active in your browser (Click here to install Java now)

Obtention des coordonnées du point B :

Le formulaire:

<form name="coordForm">

<input onclick="obtenirCoords('B');" type="button" value="Obtenir les coordonnées de B: " />

<input name="obtenirX" size="5" type="text" />

<input name="obtenirY" size="5" type="text" /></form>

 La fonction obtenirCoords:

function obtenirCoords(objName) 
{
  var applet = document.ggbApplet;
  var x = applet.getXcoord(objName);
  var y = applet.getYcoord(objName);

  document.coordForm.obtenirX.value = x;
  document.coordForm.obtenirY.value = y;
}

Affectation de nouvelles coordonnées à B:

Le formulaire  de saisie :


<form name="coordForm">

<input onclick="donnerCoords('B', donnerX.value, donnerY.value);" type="button" value="Modifier les coordonnées de B: " />

<input name="donnerX" size="5" type="text" value="6" />

<input name="donnerY" size="5" type="text" value="3" /></form>

La fonction donnerCoords:

function donnerCoords(objName, x, y) 

{
  // construit une chaine comme "B = (3, 2)" avec les paramètres d'entrée
  // évaluation de cette chaine
  document.ggbApplet.evalCommand(objName + " = (" + x + ", " + y + ")");
}

Tutoriel Javascript 3: Remplir un champ et faire un test.

Sorry, the GeoGebra Applet could not be started. Please make sure that Java 1.5 (or later) is installed and active in your browser (Click here to install Java now)

L'abscisse est:

Les éléments du Tutoriel Javascript 2 ont été repris. On effectue maintenant un test. Le fichier GeoGebra initial contient deux nombres a et a1, un point A=(a,0), un test nommé okAns renvoyant un nombre (booléen): Si[a1 ≟ a, 1, 0] et un texte nommé Anstext à l'affichage conditionnel Si[okAns ≟ 1, "Oui, x=" + a1, "Non, x≠" + a1]. Anstext n'est pas affiché initialement. Toutes ces entrées peuvent se faire à partir du champ de saisie du fichier GeoGebra.

Le code contient, en plus de celui du tutoriel 2, un champ de saisie, un bouton d'envoi et une fonction.

La fonction:

function checkAnswer(x){

  document.ggbApplet.evalCommand("a1="+x);

  document.ggbApplet.setVisible("Anstext",true);

La fonction sera appelée lors du clic sur le bouton d'envoi et x sera la valeur entrée par l'utilisateur dns le champ de saisie.

Le champ de saisie:

<input name="xval" size="6" type="text" value="-3" />

Le bouton d'envoi:

<input class="navCurOff" name="button" onclick=" checkAnswer(xval.value);" onmouseout="this.className='navCurOff';" onmouseover="this.className='navCurOn';" type="button" value=" Tester la réponse " />

Tutoriel Javascript 2 : Placer un point au hasard

Sorry, the GeoGebra Applet could not be started. Please make sure that Java 1.5 (or later) is installed and active in your browser (Click here to install Java now)

Il faut créer le code d'une fonction pour générer l'abscisse du point :

<script type="text/javascript">

//

function gensetInt(objName,rang) {

    // génère un signe plus ou moins

  var sgn1 = 2*Math.floor(Math.random()*2)-1;

    // genère un nombre entier entre 1 et rang 

  var n1 = Math.ceil(Math.random()*rang);

  var z=sgn1*n1;

  document.ggbApplet.evalCommand(objName + " = " + z);

}

//

</script>

Ensuite il faut générer le code du bouton créant le nouveau point :

<input  type="button" value="Nouveau Point" onclick="gensetInt('a',10);">

Dans le fichier GeoGebra, a est un curseur variant de -10 à 10 et A=(a,0).

Remarque: L'abscisse du point ne vaudra jamais 0 avec une telle fonction !

Source : http://math247.pbworks.com/GeoGebra-and-Javascript

L'objet Math en Javascript : http://www.commentcamarche.net/contents/javascript/jsmath.php3

Tutoriel Javascript 1 : Créer des boutons

Sorry, the GeoGebra Applet could not be started. Please make sure that Java 1.4.2 (or later) is installed and active in your browser (Click here to install Java now)

Syntaxe Javascript de chaque bouton.
Le code se situe juste en dessous de celui de l'applet GeoGebra:

<input type="button" value="Cacher A" onclick="document.ggbApplet.setVisible('A', false);">

<input type="button" value="Montrer A" onclick="document.ggbApplet.setVisible('A', true);">

<input type="button" value="A rouge" onclick="document.ggbApplet.setColor('A', 255, 0, 0);">

<input type="button" value="A bleu" onclick="document.ggbApplet.setColor('A', 0, 0, 255);">

<input type="button" value="A et B bleus" onclick="document.ggbApplet.setColor('A', 0, 0, 255);

                                               document.ggbApplet.setColor('B', 0, 0, 255);">

<input type="button" value="A et B rouges" onclick="document.ggbApplet.setColor('A', 255, 0, 0);

                                               document.ggbApplet.setColor('B', 255, 0, 0);">

<input type="button" value="Supprimer A" onclick="document.ggbApplet.deleteObject('A');">

<input type="button" value="RAZ" onclick="document.ggbApplet.reset();">

<input onclick="tracedroite();" type="button" value="Afficher la droite (AB)" />


<input type="button" value="Effacer la droite(AB)" onclick="document.ggbApplet.deleteObject('D');">



Code de la fonction pour tracer la droite:

<script type="text/javascript">
function tracedroite()
{
var app = document.ggbApplet;
app.setRepaintingActive(false);
app.evalCommand("D=Droite[A,B]");
app.setRepaintingActive(true);
}
</script>

Source : http://claparede.educanet2.ch/gisin3os/javascript/geogebra/geogebra.html

Tutoriel 17: Coordonnées polaires - coordonnées cartésiennes

Sorry, the GeoGebra Applet could not be started. Please make sure that Java 1.4.2 (or later) is installed and active in your browser (Click here to install Java now)

Tutoriel 15: Tableur et points

Sorry, the GeoGebra Applet could not be started. Please make sure that Java 1.4.2 (or later) is installed and active in your browser (Click here to install Java now)

Tutoriel 12: Séquence, listes et éléments d'une liste

Sorry, the GeoGebra Applet could not be started. Please make sure that Java 1.4.2 (or later) is installed and active in your browser (Click here to install Java now)

Tutoriel 7: Trace, lieu et optimisation

L'objectif est de conjecturer quel est le rectangle de périmètre donné ( 10 unités ) d'aire maximale.











Sorry, the GeoGebra Applet could not be started. Please make sure that Java 1.4.2 (or later) is installed and active in your browser (Click here to install Java now)