1

動的データを使用してモリス ドーナツ グラフを作成しようとしていますが、動的データをラベルに渡す方法がわかりません。

SQLidB メソッド クエリ:

    get_requests_count_per_ouc_per_month($month){
        $connection = get_db();
$query = "SELECT U.ouc AS ouc, COUNT(R.engineer_uin) AS no_of_requests 
            FROM users AS U 
            INNER JOIN request AS R ON R.engineer_uin = U.uin
            AND EXTRACT(MONTH FROM R.date_received) =".$month." 
            GROUP BY U.ouc
            ORDER BY no_of_requests";


    return $connection->query($query);
}

クエリは次の結果を返します。

ouc     |  no_of_requests

BVG15   |  1
BVG16   |  2
BVG13   |  4
BVG1C3  |  5

labelsouc と no_of_requests を次のように渡したいykeys:

私のドーナツチャートは次のようになります。

donut_chart_pct = Morris.Donut({
      element: 'donut_chart_pct',
      data: [
        {label: "BVG15", value: 1},
        {label: "BVG16", value: 2},
        {label: "BVG13", value: 4},
        {label: "BVG1C3", value: 5}

      ],

    });

oucただし、返される数がわからないため、動的にする必要があります。つまり、返されるLabel一意の数とそれぞれの数に応じて縮小/拡大する必要がありますOUC'scounts

これは私が試したことです：

    function prepare_donut_chart_requests_per_ouc_org_data(){
    //$returnArray=array();
            $month = date('m', strtotime(date('Y-m-01')));
            $requests = get_requests_count_per_ouc_per_month($month);

            while($row = $requests->fetch_assoc()) {
                $returnArray[]=array('ouc'=>$row['ouc'],'total'=>$row['no_of_requests']);
            }

    return $returnArray;

}
$returnArray = prepare_donut_chart_requests_per_ouc_org_data();
    http_response_code(200);
    echo json_encode($returnArray);

次の配列が json 形式で返されます。

[{"ouc":"BVG15","total":"1"},{"ouc":"BVG16","total":"2"},{"ouc":"BVG13","total":"4"},{"ouc":"BVG1C3","total":"5"}]

動的に渡す方法がわからないため、ドーナツチャートのラベルを対応する値で設定する方法がわかりませんか?

私の JavaScript は次のようになります。

function add_donut_chart_requests_per_ouc_org_data(){  


      $.ajax({
        type:"GET",
        url:"graph-calls.php",
        dataType:"json",
        contentType:"application/json",
        data:"chart=donut_chart_requests_per_ouc_org",

        success:function(response){

        reload_chart('donut_chart_requests_per_ouc_org',response);
        console.log(JSON.stringify(response));
        },
          error: function(response){
             alert('there was an error!' + JSON.stringify(response));
          }
      });

      return false;
}

function reload_chart(chart,response){
     if(chart=='donut_chart_requests_per_ouc_org'){

    if(response!=null){
      var ouc= response.ouc;
      var total= response.total;

      var donut_chart_data = [

        {label: ouc, value: total}

        ];

        donut_chart_requests_per_ouc_org.setData(donut_chart_data);
        donut_chart_requests_per_ouc_org.redraw();

    }



  }
}

ouc問題は、私が価値を得ることができないように見えることtotalです。印刷すると、 と表示されますundefined。私は何を間違っていますか？:/どんなコード例でも大歓迎です

アップデート

私のjavascriptreloadメソッドに次の変更を加え、現在動作しています：

if(chart=='donut_chart_requests_per_ouc_org'){

      donut_chart_data=[];

      for(var i=0; i<response.length;i++){
              var ouc= response[i].ouc;
              var total= response[i].total;

              donut_chart_data[i]={label:ouc,
                          value:total
                     };

          }
                console.log(donut_chart_data);

        if(donut_chart_data.length){

        donut_chart_requests_per_ouc_org.setData(donut_chart_data);
        donut_chart_requests_per_ouc_org.redraw();
        }

  }
4

0 に答える 0