2

嗨，我想使用 Google API 创建一个图表，我已经编写了用于从 MVC 控制器中的数据库中检索数据的代码，所有精细数据都即将到来，但它给出了一个错误，例如“给定轴上的所有系列必须是相同的数据类型× “......我有错误的地方可以帮助做到这一点吗？

这是我的 .cshtml 代码 

google.load("visualization", "1", { packages: ["corechart"] });
google.setOnLoadCallback(drawChart);

function drawChart() {
    $.get('/Chart/GetData', {},
        function (data) {
            var tdata = new google.visualization.DataTable();

            tdata.addColumn('number', 'Bank_Code');
            tdata.addColumn('number', 'Branch_Code');
            tdata.addColumn('number', 'Branch_ID');
            tdata.addColumn('string', 'Branch_Location');


            for (var i = 0; i < data.length; i++){
                tdata.addRow([data[i].Bank_Code, data[i].Branch_Code, data[i].Branch_ID, data[i].Branch_Location]);
            }

            var option = { title: "Bank Details" };

            var chart = new   google.visualization.AreaChart(document.getElementById('chart_div'));
            chart.draw(tdata, option);
        });
}

</script>


<div id="chart_div" style="width:900px;height:500px"></div>

这是我的控制器用于绑定数据的代码

public ActionResult GetData()
   {
        return Json(CreatBankList(), JsonRequestBehavior.AllowGet);
    }

    private IEnumerable<BankModel> CreatBankList()
    {
        List<BankModel> BankDetails = new List<BankModel>();

        MORESAND_TCUK_ERP_DBEntities dbContext = new MORESAND_TCUK_ERP_DBEntities();
        var list = dbContext.bank_branch.ToList();

        foreach (var item in list)
        {
            BankDetails.Add(new BankModel()
            {
                Branch_ID = item.bank_branch_id,
                Bank_Code = item.bank_code,
                Branch_Code = item.branch_code,
                Branch_Location = item.branch_location
            });
        }

        return BankDetails;
    }
4

1 回答 1

1

看起来您选择的图表类型是面积图，而您扔给它的数据格式不正确。例如，对于面积图，我会将第一列作为 x 轴，然后将下一列作为图表中的系列。例如：

[年份、销售额、费用]、[2014、2000、3000]、[2015、3000、4000]

我认为问题在于您将最后一列作为字符串，因此图表对于如何绘制它感到困惑。

https://developers.google.com/chart/interactive/docs/gallery/areachart

这个链接比我更清楚地说明了这一点

于 2015-08-06T14:26:45.923 回答