通过 php 查询在 Google 折线图上显示来自 MySQL 数据库的非均匀时间间隔样本

Question

我正在使用 Google 的折线图，我从 MySQL 的数据库中获取数据，以显示一些变量在不同日期时间的点。采样时间是 1 分钟，但有时会丢失一些点（不用担心原因），所以当我创建 de chart 时，两点之间的距离在 1 分钟或 1 小时内是相同的。我希望样本之间的水平 space 与时间跳跃一致。

生成图表的日期 selection 和查询是：

<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post">
  <select name="date_selected">
    <option value="">Seleccione:</option>
    <?php
      $available_dates=$connection->prepare("SELECT DISTINCT from_unixtime(ROUND(`time@timestamp`, 0),'%Y-%m-%d') as `Date` FROM `hostname_dbweintek_%m%d_data`");
      $available_dates=$available_dates->execute(array());
      while ($row_AvDate=$available_dates->fetch(PDO::FETCH_ASSOC)) {
        echo '<option value="'.$row_AvDate['Date'].'">'.$row_AvDate['Date'].'</option>';
      }
      $available_dates->closeCursor();
    ?>
  </select>
  <input type='submit' value="Generar">
</form>
</p>
</div>  

<?php
    if(isset($_POST["date_selected"])){
    $fecha=$_POST["date_selected"];
        //Where ejecuta antes que el alias "as `DateTime`", con lo cual: o se vuelve a escribir
        //todo el campo para el criterio "from_unixtime...", o se hace una subconsulta
    $query="select * from (SELECT 
                from_unixtime(ROUND(`time@timestamp`, 0),'%Y-%m-%d %H:%i') as `DateTime`, 
                CAST(data_format_0 AS DECIMAL(5,1))  as `Var0_MIN`,
                CAST(data_format_1 AS DECIMAL(5,1)) as `Var1_EXP`,
                CAST(data_format_2 AS DECIMAL(5,1)) as `Var2_SIN` 
            FROM 
                `hostname_dbweintek_%m%d_data`) s
            WHERE
                `DateTime` LIKE '$fecha%'";
    $result_rows=$connection->query($query)->fetchAll(PDO::FETCH_OBJ); //esto es un array de objetos    
?>

和脚本：

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

function drawChart() {
var data = google.visualization.arrayToDataTable([
['Fecha y hora', 'Var0_MIN', 'Var1_EXP', 'Var2_SIN'],
<?php
foreach($result_rows as $dato):
?>
['<?php echo $dato->DateTime ?>', <?php echo $dato->Var0_MIN ?>, <?php echo $dato->Var1_EXP ?>, <?php echo $dato->Var2_SIN ?>],
 <?php endforeach; ?>
]);

var options = {
    title: 'Resultado de la consulta de datos',
    curveType: 'none',
    axisTitlesPosition: 'out',
    'backgroundColor':{'fill':'#FFFFFF', 'stroke':'#F1F1F1', 'strokeWidth':10},
    chartArea: {'backgroundColor':'#F1F1F1'},
    fontSize: 12,
    fontName: 'Arial',
    hAxis:{title: 'Fecha y hora',
           titleTextStyle: {color: '#000000'}, 
           slantedText: false,
           slantedTextAngle: 60,
           minTextSpacing: 100},
    legend: {position: 'right', textStyle: {color: 'black', fontSize: 10}, alignment:'center', maxLines:5},
    lineWidth: 1,
    
    
    
};

var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));

chart.draw(data, options);
}
</script>

最终的想法是select一天，显示这一天的数据，所以X轴应该是24小时。

Real data with non uniform spaced data

How it is showed in chart

Answer 1

轴标签未正确间隔的原因是它们作为字符串加载到图表中

要获得期望的结果，您需要使用实际的日期对象

这可能就像进行以下更改一样简单...

环绕日期字符串 new Date()，此处...

<?php
foreach($result_rows as $dato):
?>
[new Date('<?php echo $dato->DateTime ?>'), <?php echo $dato->Var0_MIN ?>, <?php echo $dato->Var1_EXP ?>, <?php echo $dato->Var2_SIN ?>],
 <?php endforeach; ?>
]);

通过 php 查询在 Google 折线图上显示来自 MySQL 数据库的非均匀时间间隔样本

Show non-uniformly time-spaced samples from MySQL database on Google Line Chart by php query

javascript

php

mysql

charts

google-visualization