Kendo UI条形图中的动态系列答案

【问题标题】：Dynamic series in Kendo UI Bar ChartKendo UI条形图中的动态系列
【发布时间】：2013-10-23 00:36:47
【问题描述】：

我在这个问题上花了几个小时，但似乎无法弄清楚如何解决它。

我正在尝试创建一个这样的堆积条形图：

http://demos.kendoui.com/dataviz/bar-charts/stacked-bar.html

我正在使用 ASP.NET MVC (Razor)。

这里是一些示例代码：

@(Html.Kendo().Chart()
    .Name("chart")
    .Title("chart")
    .Legend(legend => legend
        .Position(ChartLegendPosition.Bottom)
    )
    .SeriesDefaults(seriesDefaults =>
        seriesDefaults.Bar().Stack(true)
    )
    .Series(series =>
    {

        series.Bar(new double[] { 4 });
        series.Bar(new double[] { 2 });
        series.Bar(new double[] { 7 });

    })
    .CategoryAxis(axis => axis
        .Categories("Machine")
        .MajorGridLines(lines => lines.Visible(false))
    )
    .ValueAxis(axis => axis
        .Numeric()
        .Labels(labels => labels.Format("{0}"))
        .Max(24)
        .Line(line => line.Visible(false))
        .MajorGridLines(lines => lines.Visible(true))
    )
    .Tooltip(tooltip => tooltip
        .Visible(true)
        .Template("#= series.name #: #= value #")
    )
)

现在这是我面临的问题。这行代码：

series.Bar(new double[] { 4 });

将值 4 添加到我的图表中。问题是，在我写代码的那一刻，我不知道会有多少系列。这将由数据库中的数据决定。例如，如果有 5 条记录，我需要添加 5 个系列，以此类推。

你知道如何添加这些系列吗？

干杯！

【问题讨论】：

标签： asp.net-mvc charts telerik kendo-ui

【解决方案1】：

对于其他有类似问题的人，我想我找到了解决方法。

@{
List<List<int>> myList = new List<List<int>>();
myList.Add(new List<int> { 7 });
myList.Add(new List<int> { 2 });
myList.Add(new List<int> { 3 });
myList.Add(new List<int> { 4 });
}        

...

.Series(series =>
        {
            for (int i = 0; i < 4;i++ )
            {
                series.Bar(myList[i]);
            }

        })
...

由于 Kendo Ui 图表想要获取列表，因此我必须创建列表列表。比使用 for 循环迭代所需的数据。这样一来，数据只能堆叠在一个类别中。

它允许系列的数量是一个变量（通过模型传递给视图）

【讨论】：