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