使用Google Charts时通过ASP.NET模型数据循环

时间:2018-04-10 19:20:38

标签: javascript asp.net-core google-visualization

我有两个动态设置的数据数组(DomainName[]DomainCount[])。我想在使用Google Charts API的ASP.NET Core应用程序中使用它们。如果数组的长度是静态的,我可以将它们编程为https://developers.google.com/chart/interactive/docs/gallery/piechart

处的API指令
       var data = google.visualization.arrayToDataTable([
          ['Task', 'Hours per Day'],
          ['Work',     11],
          ['Eat',      2],
          ['Commute',  2],
          ['Watch TV', 2],
          ['Sleep',    7]
        ]);

但是,我的数组长度不是静态的。是否可以遍历数组以添加到Google图表数据表?

我试过

        var data = new google.visualization.arrayToDataTable([
            [@Model.DomainName, @Model.DomainCount]
        ]);

        var data = new google.visualization.DataTable();
        for (var i = 0; i < @Model.DomainName.Length; i++) {
            //indexer 'i' is not recognized
            data.addRows([@Model.DomainName[i], @Model.DomainCount[i]]);
        }

        var data = new google.visualization.DataTable();
        for (var i = 0; i < @Model.DomainName.Length; i++) {
            //this causes a syntax error
            data.addRows([@Model.DomainName+'[' + i + ']', @Model.DomainCount+'[' + i + ']']);
        }

1 个答案:

答案 0 :(得分:0)

以下是我能够为Google图表动态分配值的方法。这不是最优雅的解决方案,所以如果有人有更好的方式请分享。

from ast import literal_eval

x = ['{0 1} {1 5} {1 8} {1 10} {2 5} {2 7} {2 4} {3 4} {4 9} {5 6}']

res = list(map(list, literal_eval('[' + x[0].replace(' ', ',') + ']')))

print(res)

# [[0, 1], [1, 5], [8, 1], [1, 10], [2, 5], [2, 7], [2, 4], [3, 4], [9, 4], [5, 6]]