php - PHP、jQuery 和 Chartist.Js：将数据库中的实时数据显示到图表中

Question

我正在尝试制作一张图表，我可以在其中查看 24 小时内服务器的玩家数量。我希望图表显示从 00:00 到晚上 11:59，从 30 到 30 分钟。（00:30、1:00、1:30 等）

我用来将数组发送到 jQuery 的代码。

$json = array();
$stmt = $link->query("SELECT * FROM online WHERE time > $date");
$stmt->execute();

while($row = $stmt->fetch(PDO::FETCH_ASSOC)){
  $row['time'] = date("H:i", $row['time']); //translate unix to human
  array_push($json, array('labels' => $row['time'],
    'series' => $row['players']
    ));
}

echo json_encode(array("json" => $json));

输出：

这是我用来显示图表的 jQuery

var url = "settings.php"
  var resp = jQuery.parseJSON(
    jQuery.ajax({
        url: url, 
        async: false,
        dataType: 'json'
       }).responseText
     );

    var JSONObject = JSON.parse(resp);

    var data = {"labels":JSONObject.labels, "series":[JSONObject.series]};


  optionsPlayersOnline = {
    lineSmooth: Chartist.Interpolation.cardinal({
      tension: 0
    }),
    low: 0,
    high: 50,
    chartPadding: {
      top: 0,
      right: 0,
      bottom: 0,
      left: 0
    },
  }

  var PlayersOnline = new Chartist.Line('.ct-chart', data, optionsPlayersOnline);

我的问题是我不知道如何使图表工作和显示。

标签： phpjqueryajaxchartist.js