使用PHP / JS自动刷新Highcharts

Question

Im attempting to get a highcharts chart to refresh every minute with new data. So far I have the chart being created using a php outputting on a header as javascript.

I have this at the top of the page:

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

Then some PHP to get the data from the database, and output in the highcharts format.

I Now have this on my index page calling the graph, it displays, then does destroy the graph, and redisplays the graph but it doesn't seem to re-run the php code:

<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);
});

Continued help much appreciated.

Answer 1

I think you are mixing server and client code here, You PHP code will only be executed once on the server, while the page is fetched.

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

Cannot update data, it will only re-execute displaygraph(), but the data inside this method is not updated from server, but the data that was fetched during page load will be used, you will need to use AJAX, and make an ajax request to get updated data and then use it to redraw the chart with newly fetched data. Try debugging you javascript using Firebug .
As for the first load issue, you can easily do it with an if statement inside display graph.

if(chart) chart.destroy();

To sum it up,

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);
?>

More on $.getJSON @ http://api.jquery.com/jQuery.getJSON/ , $.ajax @ http://api.jquery.com/jQuery.ajax/ json-encoding in php @ http://php.net/manual/en/function.json-encode.php