【发布时间】:2021-01-15 02:25:50
【问题描述】:
我正在尝试擦干我地下室的墙壁。为此,我有两个比重计(一个在地下室里面,一个在外面)。与这些值相关的是,我打开了从外面带来新鲜空气的通风口,或者我启动了除湿机。这个系统对我来说很好用。但是为了监视和控制这个系统的功能,我将值写入 MySQL 数据库:
现在我正在使用图表库 Highcharts 进行演示:
LineChart in webbrowser with wrong Month
如您所见,实际值和最后值是从 10 月 29 日开始的,正好是未来一个月。
我的互联网研究表明,在 JavaScript 中,月份数组以 0 开头,在 PHP(我用于从 MySQL 数据库中提取值)中,月份数组似乎以 1 开头。所以我的问题是:我该如何解决这个问题?
我擅长电子学,也擅长对微型计算机进行编程,但在这次演示中,我将来自不同站点的许多代码部分拼凑在一起,几乎完成了。但也只是差不多。如果可能的话,我可以接受任何肮脏的解决方法,比如
datetime2.setMonth((datetime2.getMonth)-1
但问题是我的编程能力很差,我无法学习完整的 JavaScript 和 PHP 书籍来解决这个烦人的小问题。
这里是 DataLogger_Chart.html 中感兴趣的代码或 chaos-sn-ps
<?php
$servername = "localhost";
$username = "XXXXXXXXX";
$password = "XXXXXXXXX";
$dbname = "Data_Logging";
// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
$sql = "SELECT Luftfeuchte_absolut_innen, Luftfeuchte_absolut_aussen, Datum FROM Data_Logging.Temp_und_Luftfeuchte WHERE Datum >= date_sub(now(), interval 24 hour)";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
while($row = $result->fetch_assoc()) {
$dataLuftFeuchteInnen[] = $row["Luftfeuchte_absolut_innen"];
$dataLuftFeuchteAussen[] = $row["Luftfeuchte_absolut_aussen"];
$dataDatum[] = $row["Datum"];
}
foreach ($dataDatum as &$value) {
$datetime1[] = date('y, n, j, G, i, s', strtotime($value));
}
unset($value); // Entferne die Referenz auf das letzte Element
foreach ($datetime1 as &$value) {
$datetime2[] = 'Date.UTC('.$value.')';
}
unset($value); // Entferne die Referenz auf das letzte Element
for ($i = 0; $i < count($dataLuftFeuchteInnen); $i++) {
$datensatz_1[$i] = "[".strval($datetime2[$i]).", ".strval($dataLuftFeuchteInnen[$i])."]";
$datensatz_2[$i] = "[".strval($datetime2[$i]).", ".strval($dataLuftFeuchteAussen[$i])."]";
}
}
else {
echo "0 results";
}
$conn->close();
?>
我认为这部分不太有趣:
<script type="text/javascript">
Highcharts.chart('container', {
title: {
text: 'Absolute Luftfeuchte Keller / Aussen'
},
subtitle: {
text: 'Wenn (Luftfeuchte aussen < Luftfeuchte innen) und (Innentemperatur > 17°C) schaltet sich der Lüfter ein. '
},
yAxis: {
title: {
text: 'Luftfeuchte in gr / m³'
}
},
在这里我可以在 Highcharts 中格式化输出格式
xAxis: {
type: 'datetime',
dateTimeLabelFormats: {
hour: '%H:%M'
}
},
最后一部分:
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'middle'
},
plotOptions: {
series: {
label: {
connectorAllowed: false
}
}
},
此时,上面的 php 数据已插入到 JavaScript 代码中
series: [{
name: 'Luftfeuchte Innen',
data: [<?php echo join($datensatz_1, ",") ?>]
}, {
name: 'Luftfeuchte Aussen',
data: [<?php echo join($datensatz_2, ",") ?>]
}],
当我查看浏览器中显示的源代码时,上面的代码片段创建了这个:
series: [{
name: 'Luftfeuchte Innen',
data: [[Date.UTC(20, 9, 28, 14, 55, 03), 10.59],[Date.UTC(20, 9, 28, 15, 00, 02),...shortened...,[Date.UTC(20, 9, 29, 14, 50, 03), 11.05]]
, {
name: 'Luftfeuchte Aussen',
data: [[Date.UTC(20, 9, 28, 14, 55, 03), 10.31],[Date.UTC(20, 9, 28, 15, 00, 02),...shortened...,[Date.UTC(20, 9, 29, 14, 50, 03), 10.97]]
}],
以及代码的最后一部分:
responsive: {
rules: [{
condition: {
maxWidth: 500
},
chartOptions: {
legend: {
layout: 'horizontal',
align: 'center',
verticalAlign: 'bottom'
}
}
}]
}
});
</script>
【问题讨论】:
-
我认为这个话题可以帮助你解决你的日期格式问题:stackoverflow.com/questions/9755911/…
-
嗨@Bastian,您的系列结构的结果似乎无效。请检查这个例子:jsfiddle.net/BlackLabel/rwvqkdn8 你可以在那里测试你的 JS 代码。此外,
dateTimeLabelFormats属性仅适用于 Highstock。
标签: javascript php mysql date highcharts