使用PHP/JS自动刷新Highcharts


Auto Refreshing Highcharts with PHP/JS

我正试图获得一个高图表,以便用新数据每分钟刷新一次。到目前为止,我已经使用php在头上输出javascript创建了图表。

我在页面顶部有这个:

<?php
    //set the output header as JS
    Header("content-type: application/x-javascript");
    //output start of javascript chart
?>
   var chart;
   chart = new Highcharts.Chart({

然后用一些PHP从数据库中获取数据,并以highcharts格式输出。

我现在在我的索引页面上有这个调用图的代码,它显示,然后销毁图,并重新显示图,但似乎没有重新运行php代码:

<script>
$(document).ready(function(){
    $.ajaxSetup({
        cache: false,
    });
    $.get("api_dashchart.php?uID=<?php echo $userInfo_ID; ?>");
    var refreshId = setInterval(function(){
        if(chart) chart.destroy();
        $.get("api_dashchart.php?uID=<?php echo $userInfo_ID; ?>");
    }, 45000);
});

非常感谢您的持续帮助。

我认为您在这里混合了服务器和客户端代码,当页面被提取时,PHP代码将只在服务器上执行一次

window.setInterval(function(
    displaygraph();
}, 60000);

无法更新数据,它只会重新执行displaygraph(),但该方法中的数据不会从服务器更新,但会使用页面加载期间提取的数据,您需要使用AJAX,并发出AJAX请求以获取更新的数据,然后使用它用新提取的数据重新绘制图表。尝试使用Firebug调试javascript
对于第一个加载问题,您可以在显示图中使用if语句轻松地完成它。

if(chart) chart.destroy();

综上所述,

charting.js

var chart;
function displaygraph() {
 $.getJSON("getjson.php", function(json) {
  if(chart) chart.destroy();
  //get data from json, and use in chart
  chart = new Highcharts.Chart({....});
});
setInterval(displaygraph, 60000);

getjson.php

<?php
  $data = ...
  echo json_encode($data);
?>

有关$.getJSON@的更多信息http://api.jquery.com/jQuery.getJSON/,$.ajax@http://api.jquery.com/jQuery.ajax/php@中的json编码http://php.net/manual/en/function.json-encode.php