<script> RGraph.CSV('../csv/result.csv', function (csv) //on récupère le fichier result { var row = csv.getRow(1, 0); // on enregistre les ligne du csv dans des variables var row1 = csv.getRow(1, 1); var row2 = csv.getRow(2, 0); var row3 = csv.getRow(2, 1); var gauge = new RGraph.Gauge({ id: 'cvs', // l id du canvas min: 0, max: 100, value: row[0], // nos variable options: { titleTop: 'point froid', titleBottom: '%', colorsRanges: [[0, 25, '#DC3912'], [25, 35,'#FF9900'], [35, 60, '#00FF00'], [60, 70, '#FF9900'], [70,100,'#DC3912']] , } // ci dessus on personnalise les zones rouge verte orange . }).draw(); var gauge1 = new RGraph.Gauge({ id: 'cvs1', min: 0, max: 60, value: row1[0], // nos variable options: { titleTop: 'point froid', titleBottom: '°C', colorsRanges: [[0, 10, '#DC3912'], [10, 15,'#FF9900'], [15, 27, '#00FF00'], [27, 32, '#FF9900'], [32,60,'#DC3912']] , } // ci dessus on personnalise les zones rouge verte orange . }).draw(); var gauge2 = new RGraph.Gauge({ id: 'cvs2', min: 0, max: 100, value: row2[0], // nos variable options: { titleTop: 'point chaud', titleBottom: '%', colorsRanges: [[0, 15, '#DC3912'], [15, 25,'#FF9900'], [25, 45, '#00FF00'], [45, 55, '#FF9900'], [55,100,'#DC3912']] , } // ci dessus on personnalise les zones rouge verte orange . }).draw(); var gauge3 = new RGraph.Gauge({ id: 'cvs3', min: 0, max: 60, value: row3[0], // nos variable options: { titleTop: 'point chaud', titleBottom: '°C', colorsRanges: [[0, 15, '#DC3912'], [15, 20,'#FF9900'], [20, 35, '#00FF00'], [35, 40, '#FF9900'], [40,60,'#DC3912']] , } // ci dessus on personnalise les zones rouge verte orange . }).draw(); }); </script> <div id="titre"> <div class="element">température</div> <div class="element">humidité</div> </div> <div id="canvas"> <canvas class="element" id="cvs1" width="250" height="250" > <!-- les canvas --> [No canvas support] </canvas> <canvas class="element" id="cvs3" width="250" height="250" > [No canvas support] </canvas> <canvas class="element" id="cvs" width="250" height="250" > [No canvas support] </canvas> <canvas class="element" id="cvs2" width="250" height="250" > [No canvas support] </canvas> </div>