У меня сейчас проблема с моим графиком Highcharts.Итак, я восстановил свои данные, находящиеся в базе данных, с помощью файла values.php , который находится ниже:
$bdd = new PDO('mysql:host=localhost;dbname=didatec;charset=utf8', 'root', ''); //Connexion
$sql = "SELECT DISTINCT date, temperature, consommation FROM acquisition, caisson, experience "; //Requête SQL
foreach ($bdd->query($sql) as $row) {
echo $row['date'] . "/" . $row['temperature']. "/" . $row['consommation']. "/" ; //Récupère "time" et "degres" dans la base
}
?>
Данные восстанавливаются в этой форме:
Время / Температура / Расход
Итак, я получаю результат на своей странице values.php в этой форме:
2018-06-06 08:21:31/ 45/6 / 2018-06-07 00: 00: 00/89/24 / 2018-06-06 09: 41: 51/64/20 / 2018-06-08 10: 19: 46/20/6 /2018-06-08 11: 25: 12/30/2 / 2018-06-08 13: 38: 08/60/8 / 2018-06-08 14: 11: 49/25/12 / 2018-06-0815: 09: 00/59/15 /
Для того, чтобы это давало:
2018-06-06 08:21:31 //Time
45 //Temperature
6 //Consumption
Затем данные обрезаются косой чертой, что позволяет мнеинтегрировать их тогда на моем графике.В настоящее время у меня есть другой график, который работает очень хорошо, как это.Я хотел бы сделать почти то же самое, но в реальной жизни.То есть, с каждым новым данными в базе, график обновляется каждую секунду и отображает данные для меня на графике.В настоящее время мой график обновляется каждую секунду, но восстанавливает данные, кто знает, где.Вот мой файл data.js, где находится мой график в реальном времени (ниже).Я попробовал несколько вещей, но я не получил ничего убедительного.Так что я хотел бы немного помочь, так как я был на нем в течение недели.Я уверен, что это тоже глупая ошибка.Благодарю вас!
Мой файл data.js:
$(function() {
var date = []; //time
var C1_Temp = []; //degres
var C1_Deci =[];
var switch1 = true;
$.get('values.php', function(data) { //Récupère les données extraites de la base de données
data = data.split('/');
for (var i = 0; i < data.length; i += 3) {
date.push(data[i]);
C1_Temp.push(parseFloat(data[i + 1]));
C1_Deci.push(parseFloat(data[i + 2]));
}
date.pop();
$('#chartLive').highcharts({ //Déclaration du graphique avec sa configuration
chart : {
animation: Highcharts.svg, // don't animate in IE < IE 10.
type : 'spline', //Type de courbe
events:{
load: function (){
var chart = this;
var series = this.series[0];
var series1 = this.series[1];
setInterval(function (){
// var x = (new Date()).getTime();
for (var i = 0; i < data.length; i += 3) {
date.push(data[i]);
var y = C1_Temp.push(parseFloat(data[i + 1]));
var z = C1_Deci.push(parseFloat(data[i + 2]));
}
series.addPoint([y], true);
series.addPoint([z], true);
}, 3000);
// chart.redraw(data);
}
}
},
title : {
text : 'Graphique en différé' //Titre du graphique
},
subtitle : {
text : 'Températures et décibels' //Texte en haut hors graph
},
xAxis : { //Axe horizontal
title : {
text : 'Date'
},
categories : date,
// max: 5,
// min: 0,
},
yAxis : { //Axe vertical
title : {
text : 'Températures et décibels', //Texte à gauche hors graph
},
},
tooltip : {
crosshairs : true,
shared : true,
valueSuffix : ''
},
plotOptions : {
spline : {
marker : {
radius : 4,
lineColor : '#666666',
lineWidth : 1
}
}
},
credits: {
enabled: false //permet de cacher le lien du graph en bas à droite
},
series : [{
name : 'Températures', //Ajout de la courbe pour la température
data : C1_Temp
},{
name : 'Décibels',
data : C1_Deci
}]
});
});
});