根据Kendo DataViz堆积图对POCO进行建模



我在创建POCO类以使用Kendo DataViz时遇到一个问题。

我们希望使用MVC包装器创建堆叠图,在Kendo的示例中,它显示了一些静态值,如

     .Column(new int[] { 1100941, 1139797, 1172929, 1184435, 1184654 }).Stack(true)
     .Column(new int[] { 810169, 883051, 942151, 1001395, 1184654  }).Stack(true)

现在,这将创建5个条形图,每个条形图中再堆叠一个数据和每个值int数组对应不同的条,所有数组中的每个索引对应相同的条

即:1100941810169对应于第一条bar1

那么如何将这些静态数据建模为POCO类并填充数据呢。

我创建了如下的POCO

    public class TroubleFound
    {
    //Service center Name for which trouble is found
    public string ServiceCenterName { get; set; }
    //Which type of trouble is found
    public string TroubleFoundName { get; set; }
    //total count of trouble found
    public List<int> TroubleFoundCount { get; set; }
    }

但它不起作用,因为它为每个条创建了一列,而不是在单个条上堆叠

    series.Bar(data.TroubleFoundCount) 

那么如何创建POCO并根据Kendo Dataviz 填充

请参阅http://demos.kendoui.com/dataviz/bar-charts/stacked-bar.html为了我真正想要发展的东西。

我最近不得不做一些非常类似的事情,但要使用列。我相信您可以在不做任何其他更改的情况下将序列类型从列切换到条形。这是我们使用的模型:

public class KendoStackedColumnChartModel
{
    public string Title { get; set; }
    public IEnumerable<KendoStackedColumnModel> StackedColumns { get; set; }
    public class KendoStackedColumnModel
    {
        public string StackName { get; set; }
        public string Colour { get; set; }
        public IEnumerable<KendoColumnModel> Columns { get; set; }
        public class KendoColumnModel
        {
            public decimal Value { get; set; }
            public string Category { get; set; }
        }
    }
}

包装中:

        .Series(series =>
        {
            foreach (WebUI.Models.KendoStackedColumnChartModel.KendoStackedColumnModel stacked in Model.StackedColumns)
            {
                series.Column(stacked.Columns).CategoryField("CategoryLabel").Field("Value").Name(stacked.StackName).Color(stacked.Colour);
            }
        } 
    )
    .SeriesColors(new string[] { "#20BDFF", "#84DAFF", "#FFCD8A", "#FE9915", "#FF6633" })

希望这能帮别人节省一些时间。。。

相关内容

  • 没有找到相关文章

最新更新