Introduction
Il peut être intéressant de pouvoir zoomer, faire varier un paramètre d'une courbe.
L'utilisateur doit pouvoir entrer la valeur du zoom. Cela se fait avec la balise <INPUT>. La valeur entrée possède un identifiant id et est récupérée dans le script par document.getElementById.
Dans l'exemple à suivre, l'entrée INPUT utilisée est de type "range". Cela permet de définir une plage de valeur (mini, maxi, pas), ainsi que la valeur par défaut. Ce type permet sous certains navigateurs tels que Chrome, Safari, d'afficher un curseur que l'utilisateur déplace. Pour d'autres navigateurs, ce type permet de saisir une valeur.
<INPUT type="range" id="nom_entrée" min="valeur_mini" max="valeur_maxi" step="valeur_pas">
La courbe doit être redessinée en prenant en compte ces nouveaux réglages. En pratique, on efface le contenu du canevas et on redessine la fonction. Pour cela, on utilise setInterval(fonction appelée, intervalle de temps). A chaque intervalle de temps (millisecondes), la fonction appelée est exécutée. Il suffit de placer dans cette fonction l'effacement du canevas et le tracé de la courbe.
