繁体   English   中英

谷歌饼图添加行 - 饼图未呈现

[英]Google pie charts add rows - pie chart didn't rendered

我在 asp.netcore 中有这个 JS 文件。 我正在尝试从我的数据库中生成一个饼图,并且只有 1 行数据。 我没有收到任何错误,但只有标题被渲染,而不是饼图。 我的 JS 代码

google.charts.load('current', { 'packages': ['corechart'] });
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
    $.ajax({
        url: '/Index?handler=GlobalChartData',
        dataType: 'json',
        contentType: 'application/json',
        type: 'GET',
        success: MyChart
    });
    function MyChart(globalData) {
        var data = new google.visualization.DataTable(globalData);
        data.addColumn('string', 'GlobalCases');
        data.addColumn('number', 'Data');
        data.addRows([
            ['NewConfirmed', globalData.NewConfirmed],
            ['NewDeaths', globalData.NewDeaths],
            ['NewRecovered', globalData.NewRecovered],
            ['TotalConfirmed', globalData.TotalConfirmed],
            ['TotalDeaths', globalData.TotalDeaths],
            ['TotalRecovered', globalData.TotalRecovered]
        ]);
        var options = { 'title': 'Global Covid Data' };
        var chart = new google.visualization.PieChart(document.getElementById('ChartForGlobal'));
        chart.draw(data, options);
    };
}

我的 c# 代码

public JsonResult OnGetGlobalChartData()
        {
            var globalData = _context.GlobalContexts.ToList();
            return new JsonResult(globalData);
        }

返回的数据图像

编辑:在添加行中, globalData.NewConfirmed -> NewConfirmed 未定义,其他未定义。

我将添加行更改为

for (var i = 0; i < globalData.length; i++)
        {
            data.addRows([
                ['NewConfirmed', Number(globalData[i].NewConfirmed)],
                ['NewDeaths', Number(globalData[i].NewDeaths)],
                ['NewRecovered', Number(globalData[i].NewRecovered)],
                ['TotalConfirmed', Number(globalData[i].TotalConfirmed)],
                ['TotalDeaths', Number(globalData[i].TotalDeaths)],
                ['TotalRecovered', Number(globalData[i].TotalRecovered)]
            ]);
        }

现在我的图表生成了。 谢谢@Swati。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM