如何使用數據庫數據在angularjs中創建圖表？

我正在嘗試創建一個條形圖。我使用此條形圖作爲參考Here。這是我的HTML部分..如何使用數據庫數據在angularjs中創建圖表？

<body ng-app="app"> 
    <div ng-controller="BarCtrl"> 
    <canvas id="bar" class="chart chart-bar" width=100% height=25 
    chart-data="data" chart-labels="labels" chart-series="series"></canvas> 
    </div>

這是我angularjs部分...

<script> 
angular.module("app",["chart.js"]).controller("BarCtrl", function ($http,$scope) { 
    $http.get("../widget/stock_details.php").success(function(data){ 
      $scope.data=data; 
      //$scope.tqnt=data.tqnt; 
      //$scope.old_quantity=data.old_quantity; 

    $scope.labels = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul','Aug','Sep']; 
    $scope.series = ['Series A', 'Series B']; 


    $scope.data = [65, 59, 80, 81, 56, 55, 40], 
       [28, 48, 40, 19, 86, 27, 90]; 
}); 
    });

如果我想在$ scope.data和$範圍我的數據庫中的數據。標籤，然後我該怎麼辦？我會嘗試這個 $scope.data = [ [data[0],data[2],data[4],data[6]] , [data[1],data[3],data[5]] ];但這不是一個好方法，所以它可能是什麼？

php文件是..

<?php 
include('connection.php'); 
$er=new Connect(); 
$er->__construct(); 

    $data=array(); 

    $selct=mysql_query("SELECT * FROM stock"); 

     while($row=mysql_fetch_array($selct)) 
     { 
      $data[]=$row['total_qnt']; 
      $data[]=$row['old_quantity']; 
      $data[]=$row['stock_date]; 
     } 

echo json_encode($data); 
?>

來源

2016-09-28 Krishna Patel

'$ data [0] [] = $ row ['total_qnt']; $ data [1] [] = $ row ['old_quantity'];'然後解析它到你的javascript代碼並傳遞給'$ scope.data'並檢查 –

@Anant謝謝你的工作方式。 –

克里什很高興幫助你 –

你需要做的是： -

變化while部分象下面這樣： -

$data[0][]=$row['total_qnt']; $data[1][]=$row['old_quantity'];

然後解析這個json encoded data到array寫入您的javascript代碼並傳遞給$scope.data。

來源

2016-09-28 04:51:35

很高興幫助你:) :)歡呼聲。 –

還有一件事，如果我想讓我的$ scope.labels的價值也是一個動態的然後該怎麼做。我已經編輯我的問題，你可以看看它。 –

您需要將所有東西（如標籤和系列）添加到您的'$ data'數組中，然後將相應的子數組傳遞給標籤，系列和數據。 –

如何使用數據庫數據在angularjs中創建圖表？

回答

相關問題