從MySQL數據庫中使用JSON和Laravel繪制谷歌圖表時，表沒有列

Question

我有這種情況，我執行一個查詢並從數據庫中獲取以下表：

GRAD_ACAD, subtotal
'DOC', 79
'LIC', 1
'MTR', 6

按照文檔中顯示的示例，我在URL中調用我的控制器：...

// Set a callback to run when the Google Visualization API is loaded.
    google.setOnLoadCallback(drawChart);

    function drawChart() {
      var jsonData = $.ajax({
          url: "{{URL::route('query01')}}",
          dataType:"json",
          async: false
          }).responseText;

      // Create our data table out of JSON data loaded from server.
      var data = new google.visualization.DataTable(jsonData);

      // Instantiate and draw our chart, passing in some options.
      var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
      chart.draw(data, {width: 400, height: 240});

...

當我打開視圖時，我得到表沒有列錯誤。 但是，通過使用firebug，我確實看到了如下所示的json：

[{"GRAD_ACAD":"DOC","subtotal":79},{"GRAD_ACAD":"LIC","subtotal":1},{"GRAD_ACAD":"MTR","subtotal":6}]

我理解我需要單獨指定列名和行。 我該怎么做？ 或者我該如何解決這個問題？

Answer 1

最簡單的方法是將json正確格式化為數組，然后可以使用google.visualization.arrayToDataTable

function right_format(data){
var arr = [];
for (var i = 0; i < data.length; i++) {
    var element = [];
    if (arr.length === 0){
        var columns = Object.keys(data[i]);
        arr.push(columns);
    };
    for (var j = 0; j < columns.length; j++){
        element.push(parseFloat(data[i][columns[j]]));
    };
    arr.push(element);
};
return arr;

};