Modeling POCO According to Kendo-DataViz Stacked Chart

Question

I have one issue while creating POCO classes to work with Kendo-DataViz.

We want to create stacked chart with using MVC wrapper and in the sample of Kendo it shows some static value like

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

now this will create 5 Bars with each bar stacked with one more data and each value in int array corresponds to different bar and each index in all array corresponds to same bar

i.e : 1100941 and 810169 corresponds to first bar bar1.

So how to model this static data into POCO classes and fill the data.

i have created POCO as below

    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; }
    }

but it's not working because it created one columns for each bar rather stacks on single bar

    series.Bar(data.TroubleFoundCount) 

so how to Create POCO and fill it according to Kendo-Dataviz

Please refer http://demos.kendoui.com/dataviz/bar-charts/stacked-bar.html for what actually i want to develop.

Answer 1

I recently had to do something very similar but with columns. I believe you can switch the series type from column to bar without any other changes. Here is the model we used:

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; }
        }

    }

}

and in the wrapper:

        .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" })

Hope this helps someone else save some time...