1

新しいデータで毎分更新するハイチャート チャートを取得しようとしています。これまでのところ、ヘッダーにjavascriptとして出力するphpを使用してチャートを作成しています。

ページの上部にこれがあります:

<?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 形式で出力します。

私は今、グラフを呼び出す私のインデックスページにこれを持っています.

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

引き続きご協力をお願いいたします。

4

1 に答える 1

0

ここでサーバーとクライアントのコードを混在させていると思います.ページがフェッチされている間、PHPコードはサーバー上で1回だけ実行されます.

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-encoding @ http://phpの詳細.net/manual/en/function.json-encode.php

于 2012-08-02T09:34:51.570 に答える