ASP.Net MVC - 爲谷歌圖表

新手，谷歌圖表JSON數據，我想創建一個谷歌圖，控制器返回像谷歌圖表所需ASP.Net MVC - 爲谷歌圖表

{"data":[["In Progress","10"],["Completed","20"],["Deleted","5"],["Overdue","8"]]}

但數據JSON數據應該像

[["In Progress",10],["Completed",20],["Deleted","5"],["Overdue",8]]

我有以下JS功能：

$(document).ready(function() { 
     $.ajax({ 
      url: '@Url.Action("TaskStatus", "Graph")', 
      data: "", 
      dataType: "json", 
      type: "POST", 
      contentType: "application/json; chartset=utf-8", 
      success: function (data) {     
       var jsonData = JSON.stringify(data); 

       var dt = new google.visualization.DataTable(); 
       dt.addColumn('string', 'Tasks'); 
       dt.addColumn('number', 'Count'); 

       $.each(arrJson, function (i, obj) { 
        $.each(obj, function (i, o) { 
         console.log(o[1]);        
         dt.addRow(o[0],parseInt(o[1])); // here I get error of datatype for "Count" column 
        })            
       }) 
       chartData = dt; 
      }, 
      error: function (err) { 
       alert(err); 
       console.log(err); 
      } 
     }).done(function() { 
      drawChart(); 
     }) 
    }) 

function drawChart() 
{   
var options = { 
       width: '500px', 
       title: "Task Status", 
       pointSize: 20, 
       chartArea:{width:"100%",height:"100px"} 
      }; 
     var pieChart = new google.visualization.PieChart(document.getElementById('chart_div')); 
     pieChart.draw(chartData, options); 
}

控制器返回

List<object> temp = new List<object>(); 
      temp.Add(new[] { "In Progress", "10" }); 
      temp.Add(new[] { "Completed", "20" }); 
      temp.Add(new[] { "Deleted", "5" }); 
      temp.Add(new[] { "Overdue", "8" }); 

      return Json(new { data = temp });

請指教如何解決此問題？提前感謝！

來源

2016-09-22 Sami

在控制器

試試這個

return Json(temp);

來源

2016-09-22 06:13:41

不工作JSON變得像{ 「數據」：[[ 「進行中」，「10」]}。同樣的問題 – Sami

你不應該使用JSON.stringify功能在你的AJAX成功回調，因爲這將改變你從服務器鑽進一個字符串對象。你可以試試這個：

success: function (result) { 
    var dt = new google.visualization.DataTable(); 
    dt.addColumn('string', 'Tasks'); 
    dt.addColumn('number', 'Count'); 

    // Taking the "data" property as your controller returns it that way 
    var data = result.data; 

    $.each(data, function (i, obj) { 
     var label = obj[0]; 
     var value = parseInt(obj[1]); 
     dt.addRow([label, value]); 
    }); 

    chartData = dt; 
},

來源

2016-09-22 06:14:11

fyi：在這一行末尾的拼寫錯誤 - >'dt.addRow（label，value）;列' – WhiteHat

dt.addRow（label，value）;更改爲dt.addRow（[label，value]）; – Sami

是的，我不熟悉'addRow'函數期望的參數。它看起來像它必須是一個數組。 –

dt.addRow只接受數組或空這是錯誤說

參考，：下面撥弄https://developers.google.com/chart/interactive/docs/reference#addrow

檢查那裏我已經更新你的代碼。

http://jsfiddle.net/79ffvayr/109/check here

來源

2016-09-22 06:29:06