Highcharts / JavaScript月份与MySQL不兼容

Question

我在试着擦干我地下室的墙。为此，我有两个比重计(一个在地下室的内部，一个在外面)。与这些值相关的是，我打开了一个从外面带来新鲜空气的通风口，或者我启动了一个除湿器。这个系统对我来说很好。但是为了监视和控制这个系统的功能，我将值写入到一个MySQL数据库中：

Datum = '2020-09-29 13:05:03'

现在我使用图表库Highcharts进行演示：

LineChart in webbrowser with wrong Month

如您所见，实际的和最后的值来自10月29日，也就是未来的整整一个月。

我在互联网上的研究表明，在JavaScript中，月数组以0开头，在PHP中(我用来从MySQL数据库中提取值)，月数组似乎是从1开始的，所以我的问题是:我如何解决这个问题？

我擅长电子学，对微型计算机编程也很在行，但为了这个演示，我从不同的网站抓取了许多代码，几乎完成了。但只差一点。如果可能的话，我可以接受任何肮脏的变通方法，比如

datetime2.setMonth((datetime2.getMonth)-1

但问题是我的编程技术很差，我不能研究一本完整的JavaScript和一本PHP书来解决这个令人讨厌的小问题。

下面是DataLogger_Chart.html中令人感兴趣的代码片段

<?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>

Answer 1

HighCharts接受以毫秒为单位的日期时间

因此，首先将datetime字符串转换为毫秒，然后传递给HighCharts对象。

Answer 2

非常感谢@Waqar，毫秒数的提示把我带到了这个网站的link，所以我改变了：

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

至

foreach ($dataDatum as &$value) {
$datetime1[] = strtotime($value);
}
unset($value); // Entferne die Referenz auf das letzte Element
foreach ($datetime1 as &$value) {
$datetime2[] = $value * 1000;
}
unset($value); // Entferne die Referenz auf das letzte Element

这对我来说太好了！