On va faire l'essai d'une jauge classique :
Récupérez le fichier "Jauges_RGraph.zip", décompressez-le. Vous avez à disposition tout pour réaliser ce TP
Ouvrez le fichier "gauge-basic.html" avec Notepad++
Ouvrez le fichier "gauge-basic.html" avec le navigateur Mozilla
a) Analysez le fichier html afin de comprendre comment est mis en œuvre cette jauge.
b) Modifiez ensuite le code html pour obtenir le résultat ci-dessous :
Contraintes :
- la taille est de 300 × 300
- la valeur est de 76 (à mettre dans une variable "valeur")
c) On se propose de personnaliser notre jauge. En vous aidant des exemples et de la documentation (http://www.rgraph.net/docs/gauge.html), modifiez votre code HTML pour obtenir le résultat suivant :
d) Modifiez le fichier CSS afin de centrer notre "canvas" et obtenir le résultat ci-dessous :
e) On va maintenant tester les bugs possibles si on rentre des valeurs erronées. Faites des essais en rentrant les valeurs suivantes, donnez les résultats obtenus et conclure:
- valeur = 150
- valeur = -143
- valeur = '92'
- valeur = 'toto'