【问题标题】:Highcharts / JavaScript month is incompatible with MySQLHighcharts / JavaScript 月与 MySQL 不兼容
【发布时间】:2021-01-15 02:25:50
【问题描述】:

我正在尝试擦干我地下室的墙壁。为此,我有两个比重计(一个在地下室里面,一个在外面)。与这些值相关的是,我打开了从外面带来新鲜空气的通风口,或者我启动了除湿机。这个系统对我来说很好用。但是为了监视和控制这个系统的功能,我将值写入 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 中感兴趣的代码或 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>

【问题讨论】:

标签: javascript php mysql date highcharts


【解决方案1】:

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

所以首先将日期时间字符串转换为毫秒,然后传递给 HighCharts 对象。

【讨论】:

  • 嘿@Waqar Akram,非常感谢您的回复。最近几天我病了,所以我很抱歉我的回复迟了:根据您的建议,我尝试将:foreach ($datetime1 as &amp;$value) { $datetime2[] = 'Date.UTC('.$value.')'; } 更改为foreach ($datetime1 as &amp;$value) { $datetime2[] = date_timestamp_get($value); } 但是当我选择一个特定的 datetime2 对象时,它是空的
  • @Bastian 你找到解决方案了吗?
【解决方案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

这对我来说完全没问题!

【讨论】:

    猜你喜欢
    • 2011-12-03
    • 1970-01-01
    • 1970-01-01
    • 2012-03-03
    • 1970-01-01
    • 1970-01-01
    • 2017-05-12
    • 1970-01-01
    • 2017-05-02
    相关资源
    最近更新 更多