1

Flot Graph Apiを使用して、クライアント側の php で棒グラフ、折れ線グラフを表示しています。例で述べたように、Json をプロット グラフに渡そうとします。

このようにJsonをパックします。

 [{"label":"63f9311f-5d33-66ad-dcc1-353054485572","bars":{"show":true},"data":        [[-170.44530493708,270.44530493708]]},{"label":"8f6dcf4a-b20c-8059-1410-353054486037","bars":{"show":true},"data":[[-791.50048402711,891.50048402711]]},{"label":"c2b4cf75-3e0b-f9ff-722e-353054485803","bars":{"show":true},"data":[[-1280.0484027106,1380.0484027106]]},{"label":"eb963e23-75cd-6131-867a-353054485894","bars":{"show":true},"data":[[-1487.2604065828,1587.2604065828]]},{"label":"ef413106-d5be-593b-1cda-353054485719","bars":{"show":true},"data":[[-1940.9583736689,2040.9583736689]]}]

しかし、グラフはプロットされていません。

     $.ajax({                                      
  url: '../c/By_Machine_Controller.php',                  //the script to call to get data          
  data: "",                        //you can insert url argumnets here to pass to api.php
                                   //for example "id=5&parent=6"
  dataType: 'json',                //data format      
  success: function(data)          //on recieve of reply
  {
    var Up = [];
    var Down = [];
    Up = data[0];              //get Up
    Down = data[1];           //get Down
    //alert(Up);
    $.plot($("#placeholder"), [ Up , Down ]);
  } 
});

Jsonと関係がありますか、それとも私のJSが間違っていますか。私はフロートに慣れていないので、手がかりがありません。誰でも私を助けることができますか?

入力した回答は正常に機能しますが、この場合、JSON を一時ファイルに書き込んでアクセスしていますが、要件は次のとおりです。

localhost の MODEL フォルダーで flot の値を計算し、それを連想配列として渡し、それを CONTROLLER フォルダーで JSON としてエンコードします。ここで、localhost の VIEW フォルダーにある JSON にアクセスする必要があります。

コントローラーコード:

    $json = json_encode($allData);
    $myFile = "ReasonByTime.txt";
    $fh = fopen($myFile, 'w') or die("can't open file");
    $stringData = "Bobby Bopper\n";
    fwrite($fh, $json);

    fclose($fh);

しかし、次のように JS を介して VIEW の CONTROLLER の $json にアクセスすると、機能しません。私はそれをグーグルで検索しましたが、修正できませんでした。これで私を助けてもらえますか?

コントローラーから JSON にアクセスするための JS コードを表示します。

      $(document).ready(function () {

    //var dataurl = '../c/By_Machine_Controller.php';

    function onDataReceived(data) {

        $.plot(placeholder, data, options);
    }
    $.ajax({
        type: "GET",
        url: '../c/By_Machine_Controller.php',
        data: 'data',
        dataType: 'json', 
        success: function(data) { 
            alert(data);
        }
    });
});
4

3 に答える 3

1

見栄えがよく、barWidth必要に応じて次のように追加できます。

http://jsfiddle.net/YHPea/ OR 例のあるページ: http://people.iola.dk/olau/flot/examples/stacking.html

Flot ライブラリがすべてのスペースを埋めるため、このような結果が得られます: http://jsfiddle.net/YHPea/1/

于 2012-11-16T12:19:00.827 に答える
0

私はいくつかのテストを行いました、単に

$.plot($("#placeholder"), data);

私のために働きます。

于 2012-11-16T12:52:42.917 に答える
0

これは私にとってはうまくいきます。

 <script language="javascript" type="text/javascript">  
$(document).ready(function(){
$.getJSON('ReasonByTime.txt', function(json) {
    $.plot($("#placeholder"),json, {bars: { show: true, barWidth:0.2},xaxis: {ticks: json.ticks}});
});

});

于 2012-11-21T15:52:37.483 に答える