1

我有以下表格形式的 MySQL 输出。

mysql输出

我想要做的是在水平时间线上绘制每个地理围栏时间​​，如下所示：

在此处输入图像描述

理论是我将时间轴创建为表格行。起点和终点为时间（15 分钟间隔），Early Time 为起点，Late Time 为终点。

在第二行，我想要动态的“盒子”，用imagefilledrectangle. 每个“盒子”的起始坐标和结束坐标是表格中的 InSeconds 和 OutSeconds。然后显然我每行需要多个“框”来表示每次访问地理围栏。

我读了几篇关于imagefilledrectangle但我不确定从哪里开始以及如何获得多个盒子的文章。显然，这些框需要与第一个表格行中的时间相关联。

目前我生成数据表的查询是：（对不起mysql_query，将在稍后阶段转换为 PDO）：

$result = mysql_query("

      select * from (select
      PreQuery.callingname as vehicle,
      PreQuery.geofence,
      PreQuery.GroupSeq,
      MIN( PreQuery.`updatetime` ) as InTime,
      UNIX_TIMESTAMP(MIN( PreQuery.`updatetime`))as InSeconds,
      MAX( PreQuery.`updatetime` ) as OutTime,
      UNIX_TIMESTAMP(MAX( PreQuery.`updatetime`))as OutSeconds,
            TIME_FORMAT(SEC_TO_TIME((MAX( PreQuery.`updatetime` )-MIN( PreQuery.`updatetime` ))),'%H:%i') as Duration,
      round((MAX( PreQuery.`updatetime` )-MIN( PreQuery.`updatetime` )),0) as DurationSeconds

   from
     ( select
              v_starting.callingname,
              v_starting.geofence,
              v_starting.`updatetime`,
              @lastGroup := @lastGroup + if( @lastAddress = v_starting.geofence 
                                         AND @lastVehicle = v_starting.callingname, 0, 1 ) as GroupSeq,
              @lastVehicle := v_starting.callingname as justVarVehicleChange,
              @lastAddress := v_starting.geofence as justVarAddressChange
           from
              v_starting,
              ( select @lastVehicle := '',
                       @lastAddress := '',
                       @lastGroup := 0 ) SQLVars
           order by
              v_starting.`updatetime` ) PreQuery
   Group By
      PreQuery.callingname,
      PreQuery.geofence,
      PreQuery.GroupSeq) parent

      where geofence <>'' and InTime>  DATE_SUB(NOW(), INTERVAL 72 HOUR) and vehicle='TT08' and Duration>0 order by InTime asc


");

我生成表的语法很简单：

<table border=1>
    <tr>
        <th>Vehicle</th>
        <th>Geofence</th>
        <th>InTime</th>
        <th>InSeconds</th>
        <th>OutTime</th>
        <th>OutSeconds</th>
        <th>Duration</th>
        <th>DurationSeconds</th>
    </tr>

    <?php
    while($row = mysql_fetch_array($result)){
    ?>
    <tr>
    <td><?php echo $row['vehicle'] ?></td>
    <td><?php echo $row['geofence'] ?></td>
    <td><?php echo $row['InTime'] ?></td>
    <td><?php echo $row['InSeconds'] ?></td>
    <td><?php echo $row['OutTime'] ?></td>
    <td><?php echo $row['OutSeconds'] ?></td>
    <td><?php echo $row['Duration'] ?></td>
    <td><?php echo $row['DurationSeconds'] ?></td>
    </tr>
    <?php } ?>
    </table>

所以我有点厚脸皮，但如果有人能给我关于如何开始的建议，那就太好了。或者，我可以阅读或用作参考的好文章。

图像填充矩形是正确的路线吗？我可以使用任何 JavaScript 解决方案或插件吗？

4

0 回答 0