Question

我在div标签中有HighCharts，它从MySQL表中提供。我通过使用PHP并转换JSON来获取此数据。

<?php
$query = "some query here ";
$result = $conn->query($query);

if (!$result) {
  echo "Could not successfully run query ($query) from DB: " . mysql_error();
  exit;
}

if (mysqli_num_rows($result) == 0) {
  echo "No rows found, nothing to print so am exiting";
  exit;
}

//array
$table = array();

while($row= mysqli_fetch_assoc($result)) {
  $table[] =$row;
};

$jsonTable= json_encode($table)
?>

我可以通过以下方式正确地看到图表：

$(function () {

var chartData = <?php echo $jsonTable ?>;

var seriesA = [];
var seriesB = [];


for (i=0; i<chartData.length; i++){

tempDate = Date.parse(chartData[i].ctime);
seriesA.push([Date.parse(chartData[i].ctime), parseInt(chartData[i].totalKbpsin)]);
seriesB.push([Date.parse(chartData[i].ctime), parseInt(chartData[i].totalKbpsout)]);

};

但是，我想用新数据每1小时更新一次我的图表。我怎么能这样做？

Answer 1

解决！
要在特定的时间间隔刷新数据，我选择调用另一个PHP页面，其输出只是JSON数据。

然后，usnig setInterval解决了我的问题。

这是代码：

function DrawContainerJson () {
        var seriesA = [];
        var seriesB = [];

        var url =  "https://domain.name/test/json.php";
        $.getJSON(url,  function(chartData) {
            // loop through the JSON data and push to the temporary series
            for (i=0; i<chartData.length; i++){
                tempDate = Date.parse(chartData[i].ctime);
                seriesA.push([Date.parse(chartData[i].ctime), parseInt(chartData[i].totalKbpsin)]);
                seriesB.push([Date.parse(chartData[i].ctime), parseInt(chartData[i].totalKbpsout)]);
            };

            var opt = SetChartOption(seriesA, seriesB);
            $('#container_json').highcharts(opt);
        });
    }


    $(document).ready(function() {              
        DrawContainerJson();
        //Refresh
        setInterval(function(){
            DrawContainerJson();
        },60000);  //1 min refresh
            });

此致

Highcharts以特定时间间隔更新

1 个答案: