数据绑定到饼图 (Google API)

Question

我正在尝试将数据动态绑定到饼图，但它不起作用。这是我的代码：

function drawChart() {
      $.ajax({
          url: "list",
          dataType: "json",
          success: function (jsonData) {
              var data = new google.visualization.DataTable();
              data.addColumn('string', 'cName');
              data.addColumn('int', 'share');

              for (var i = 0; i < jsonData.length; i++) {
                  data.addRow([jsonData[i].cName, jsonData[i].share]);
              }

              var options = {
                  title: 'Certificate details',
                  backgroundColor: '#e9e9e9'
              };
              var chart = new google.visualization.PieChart(document.getElementById('piechart'));
              chart.draw(data, options);
          }
      });}

函数：

public JsonResult list()
    {
        int regId = getUserId(Session["username"].ToString());
        var result = (from e in db.share_bought_history
                      where e.regist_id == regId
                      group e by e.comapnay_id into companies
                      select new
                      {
                          cName = companies.FirstOrDefault().company.company_name,
                          share = companies.Sum(x => x.no_of_sahre)
                      });
        return Json(result.ToList(), JsonRequestBehavior.AllowGet);
    }

我也尝试直接传递 DataTable 但同样的问题（没有显示）这是代码：

function drawChart() {
      $.ajax({
          url: "list",
          dataType: "json",
          success: function (jsonData) {
              var options = {
                  title: 'Certificate details',
                  backgroundColor: '#e9e9e9'
              };
              var chart = new google.visualization.PieChart(document.getElementById('piechart'));
              chart.draw(jsonData, options);
          }
      });

函数：

public JsonResult list()
    {
        DataTable dataTable = new DataTable("pie");
        dataTable.Columns.Add("cName", typeof(System.String));
        dataTable.Columns.Add("share", typeof(System.Int16));
        int regId = getUserId(Session["username"].ToString());
        var result = (from e in db.share_bought_history
                      where e.regist_id == regId
                      group e by e.comapnay_id into companies
                      select new
                      {
                          cName = companies.FirstOrDefault().company.company_name,
                          share = companies.Sum(x => x.no_of_sahre)
                      });
        foreach (var item in result)
        {
            DataRow row = dataTable.NewRow();
            row[0] = item.cName;
            row[1] = item.share;
            dataTable.Rows.Add(row);
        }
        return Json(dataTable, JsonRequestBehavior.AllowGet);
    }

并且不明白问题出在哪里，因为当我手动传递数据（静态）时，饼图显示完美。喜欢：

function drawChart() {
    var data = google.visualization.arrayToDataTable([
      ['Task', 'Hours per Day'],
      ['Work',     11],
      ['Eat',      2],
      ['Commute',  2],
      ['Watch TV', 2],
      ['Sleep',    7]
      ]);

    var options = {
        title: 'My Daily Activities',
        backgroundColor: '#e9e9e9'
    };
      var chart = new google.visualization.PieChart(document.getElementById('piechart'));

    chart.draw(data, options);
  }

Answer 1

使用上面的第一个片段...

将 'int' 更改为 'number'...

data.addColumn('number', 'share');

数据绑定到饼图 (Google API)

Data Bind to Pie Chart (Google API)

asp.net

jquery

json

google-visualization

google-pie-chart