Question

这是我的源码ViewGraph.php

startActivity(new Intent(getApplicationContext(), Casa.class));

我在底部有

        <?php   
            $datesGraph = array();
            $Moneyss = array();
            $SQL = "select right(DateTransaksi,2) as Dates, SUM(AllMoney ) as Money from view_resume_transaksi 
                    where DateTransaksi between '20160401' and '20160420' group by DateTransaksi order by DateTransaksi asc" ; 

             $hasil=sqlsrv_query($conn, $SQL) or die($SQL . "<br>" .print_r( sqlsrv_errors(), true)) ;
                while($row = sqlsrv_fetch_array($hasil)){
                                        $Moneyss[$row[0]] = (int)$row[1];
                                         $datesGraph[]=$row['tgl'];
                                         $Moneyss[]=$row['Money'];

                                    }

?>

<script>
    var randomScalingFactor = function(){ return Math.round(Math.random()*100)};
    var lineChartData = {
         labels : <?=json_encode($datesGraph);?>,
        datasets : [
            {
                label: "My Second dataset",
                fillColor : "rgba(151,187,205,0.2)",
                strokeColor : "rgba(151,187,205,1)",
                pointColor : "rgba(151,187,205,1)",
                pointStrokeColor : "#fff",
                pointHighlightFill : "#fff",
                pointHighlightStroke : "rgba(151,187,205,1)",
            data : <?=json_encode($Moneyss);?>
            }
        ]
    }
    window.onload = function(){
    showGrafik();
}

function showGrafik(){
    var ctx = document.getElementById("canvas").getContext("2d");
        window.myLine = new Chart(ctx).Line(lineChartData, {
            responsive: true
        });
}

这是从mysql成功加载数据... 但我不知道，如果用户更改日期并从mysql和视图中获取日期。我的意思是如果像这样的散文＆gt;选择日期 - ＆gt;使用ajax发送数据 - ＆gt;查看图表。现在就像这样散假＆gt; load .php - ＆gt;查看图形（因为sql使用不从接口获取参数）。

请帮助我，我想用ajax显示图表...感谢您的关注。

Answer 1

在javascript中创建一个函数，接受dateFrom和dateTo作为参数，通过ajax在php中调用sql查询。像这样......

var path_to_php_file = 'getdate.php';
   function loadchartbydate(dateFrom,dateTo){
    $.ajax(){
      url: path_to_php_file,
      type: 'POST',
      dataType: 'json',
      data: {'dateFrom': dateFrom, 'dateTo': dateTo},
      success: function(data){
        //display data in chart
        //add under success callback function
        var randomScalingFactor = function(){ return                               Math.round(Math.random()*100)};
        var lineChartData = {
         labels : <?=json_encode($datesGraph);?>,
           datasets : [
              {
                 label: "My Second dataset",
                 fillColor : "rgba(151,187,205,0.2)",
                 strokeColor : "rgba(151,187,205,1)",
                 pointColor : "rgba(151,187,205,1)",
                 pointStrokeColor : "#fff",
                 pointHighlightFill : "#fff",
                 pointHighlightStroke : "rgba(151,187,205,1)",
                  data : <?=json_encode($Moneyss);?>
              }
            ]
          }
       window.onload = function(){
              var ctx = document.getElementById("canvas").getContext("2d");
              window.myLine = new Chart(ctx).Line(lineChartData, {
                             responsive: true
              });
       }

      },
      error: function(err){
        console.log(err.responseText); 
       }
    } 
}

PHP Chart Js加载Mysql和接口

1 个答案: