<script type="text/javascript"> $(function() { $.getJSON('data2.php', function(data) { // on récupère les data du json. // on créer le graphe dans la div id : container3 $('#container3').highcharts({ title : { text : 'humidité' }, tooltip: { shared: true }, yAxis: [{ // Premier yAxis title: { text: 'humidity', style: { color: Highcharts.getOptions().colors[0] } }, min : 20, max : 60, tooltip: { valueSuffix: ' %' }, labels: { format: '{value} %', style: { color: Highcharts.getOptions().colors[0] } } }, { // Second yAxis title: { text: 'humidity', style: { color: Highcharts.getOptions().colors[1] } }, min : 20, max : 60, tooltip: { valueSuffix: ' %' }, opposite: true, labels: { format: '{value} %', style: { color: Highcharts.getOptions().colors[1] } } }], // le xAxis xAxis: { categories: data[0]['data'] //correspond au 1er groupe de donnée du json créer par data.php (dateandtime pointchaud) }, legend: { layout: 'vertical', align: 'right', verticalAlign: 'top', x: -100, y: 0, floating: true, borderWidth: 0 }, series: [{ type: 'spline', name: 'pointchaud', yAxis: 0, tooltip: { valueSuffix: ' %' }, data: data[2].data //correspond au 3 ème groupe de donnée du json créer par data.php (humidité pointchaud) }, { type: 'spline', name: 'pointfroid', yAxis: 1, tooltip: { valueSuffix: ' %' }, data: data[5].data //correspond au 6 ème groupe de donnée du json créer par data.php (humidité pointfroid) }] }); }); }); </script> <section> <div id="container3"></div>