google图表和mysql时间戳处理问题

kninwzqo  于 2021-06-20  发布在  Mysql
关注(0)|答案(1)|浏览(324)

我有一个mysql数据库的日志记录设备,我想从中读取几百行,并用它创建一个google图表。
我似乎找不到一个好方法将mysql时间戳数据转换为google图表数据数组的timeofday列类型。
https://developers.google.com/chart/interactive/docs/datesandtimes
我已经开发了一个php,它可以回显我想要的数据,但是我仍然坚持使用mysql或unix时间戳格式。php文件:

<?php 
            $mysqli = new mysqli("localhost", "readuser", "***", "***");
            /* check connection */
            if ($mysqli->connect_errno) {
                printf("Connect failed: %s\n", $mysqli->connect_error);
                exit();
            }
            /* Select queries return a resultset */
            if ($result = $mysqli->query("SELECT ID, Timestamp, temp FROM temperature ORDER BY ID DESC LIMIT 5")) {
                while($row = mysqli_fetch_assoc($result))
                {
                $dataset1[] = array($row['Timestamp'],$row['temp']);
                }

            /* encode array to JSON for JavaScript */
            echo json_encode($dataset1); 

            /* free result set */
            $result->close();
            }

        ?>

上述php执行示例:

[
["2018-08-03 17:01:33","80.60"],
["2018-08-03 17:01:23","81.05"],
["2018-08-03 17:01:13","80.60"],
["2018-08-03 17:01:03","81.05"],
["2018-08-03 17:00:53","81.05"]
]

我相信google charts希望看到的是:

[
[[17, 01, 33],80.60],
[[17, 01, 23],81.05],
[[17, 01, 13],80.60],
[[17, 01, 03],81.50],
[[17, 00, 50],81.05]
]

以下是数据将进入的主php文件(ajax访问json数据php文件,并以setinterval更新图表绘图):

<html>
  <head>
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript"> 
      google.charts.load('current', {'packages':['line']});
      google.charts.setOnLoadCallback(drawChart);

      /* declare variable for json data */
    var chardata;
    /* ajax to pull mysql data via php file */
    function chartdataquery() {
        jQuery.ajax({
            url:'/mysql/chartdata.php',
            type:'POST',
            async: false,
            dataType: 'json',
            success:function (results) {
                chartdata = (results);
                } 
            });
         };
    /* Set the chartdata update frequency */
    updatequeryInterval = setInterval(chartdataquery,10000);

/* drawing the chart at the setInterval duration, at the end of the function */
    function drawChart() {

      var data = new google.visualization.DataTable();
      data.addColumn('timeofday', 'Time');
      data.addColumn('number', 'Temperature');

      data.addRows(chartdata);

      var options = {
        chart: {
          title: 'Temperature',
          subtitle: 'updated every 10 seconds'
        },
        width: 900,
        height: 500
      };

      var chart = new google.charts.Line(document.getElementById('linechart_material'));

      chart.draw(data, google.charts.Line.convertOptions(options));
    }

    </script>
  </head>
  <body>
    <div id="linechart_material" style="width: 900px; height: 500px"></div>
  </body>
</html>

这是正确的吗?我可以用mysql查询、php或javascript来完成这些任务吗?我最好的方法是什么使数组google chart与timeofday兼容?
谢谢!

5sxhfpxr

5sxhfpxr1#

试着像这样加载php数组。。。

while($row = mysqli_fetch_assoc($result))
{
  $dataset1[] = array(array((int) date_format(new DateTime($row['Timestamp']), 'H'), (int) date_format(new DateTime($row['Timestamp']), 'i'), (int) date_format(new DateTime($row['Timestamp']), 's')),$row['temp']);
}

要使上述功能正常工作,您需要将google列类型更改为。。。

data.addColumn('timeofday', 'Time');

相关问题