代码之家 › 专栏 › 技术社区 › coolhand

通过ASP循环。使用Google图表时的NET模型数据

google-visualization asp.net-core javascript

coolhand · 技术社区 · 6 年前

我有两个数据数组( DomainName[] 和 DomainCount[] )动态设置的。我想在ASP中使用这些。NET核心应用程序,利用谷歌图表API。如果数组的长度是静态的,我可以对它们进行类似于 https://developers.google.com/chart/interactive/docs/gallery/piechart

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

然而,我的数组在长度上不是静态的。是否可以循环遍历数组以添加到Google charts数据表中?

我试过了

        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 回复 | 直到 6 年前

coolhand 6 年前

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

        //serialize the ASP.NET model data to a JSON object
        var domainName = @Json.Serialize(Model.DomainName);
        var domainCount = @Json.Serialize(Model.DomainCount);
        //the JSON object needs to be cast as a number for the chart
        for (var i = 0; i < domainCount.length; i++) {
            domainCount[i] = parseInt(domainCount[i]);
        }
        //Use 'DataTable' rather than arrayToDataTable in order to use
        // the 'addRows' function
        var data = new google.visualization.DataTable();
        data.addColumn('string', 'Category');
        data.addColumn('number', 'Number');
        //loop through the serialized array rather than the model data
        // using 'addRows'
        for (i = 0; i < domainCount.length; i++) {
            data.addRows([
                [domainName[i], domainCount[i]]
            ]);
        }

        var options = {
            'title': 'Chart Title',
        }

        var chart = new google.visualization.PieChart((document.getElementById('MyChart')));
        chart.draw(data, options);

推荐文章

cmill · Google Visualization第1行不显示。使用时使用ColorFormat()。setProperty()

6 年前

Paul Chris Jones · 在google中包含字符串列。可视化。数据组

6 年前

yash041 · google charts图形设置图例值和相同颜色列

6 年前

I am the Most Stupid Person · 谷歌图表图例位置顶部不工作

6 年前

coolhand · 通过ASP循环。使用Google图表时的NET模型数据

6 年前

ndd · Google ChartWrapper不适用于直方图

6 年前

Nabeel · 显示一些点的Google散点图工具提示

6 年前

fab · Google Charts API:在折线图中显示数据点值

6 年前

StefanN · Google散点图复制相同的域(x轴)值

6 年前

Babasaheb Dhodad Nicholas J. Markkula · 如何将导出csv选项设置为google可视化饼图中的按钮

6 年前