Line chart correctly display categories with some missing values

[Michael]

Here's my ViewModel

    public class EmailStartsViewModel
    {
        public int Year { get; set; }
        public int Week { get; set; }
        public int Starts { get; set; }
    }​

 I would like to display a line chart that has a category axis value for each week of the year i.e. 1 - 52, and that groups the data by year, so that it display a line for each year.

The data covers 2012 through the present, and looks like this: 

Year     Week Starts
2013    1         1
2015    1         11
2014    2         1
2015    2         8
2013    3         3
2015    3         20
2013    4         9
2015    4         30
2012    5        1
2013    5        3
2014    5        1
2015    5        18

etc up to week 53 (because of partial weeks) 

 

With these settings 

                  .DataSource(ds => ds
                      .Read(read => read
                          .Action("StartData", "Starts")
                          .Data("StartSettings"))
                      .Group( group => group.Add(model => model.Year))
                              .Sort(sort => sort.Add(model => model.Week))
                  )
                  .Series(series =>
                  {
                      series.Line(model => model.Starts, categoryExpression: model => model.Week).Name("Starts");

                  })
                  .CategoryAxis(axis => axis
                      .Categories(model => model.Week)
                  )​

It starts with week 5 which is the first week that has data in the first year. Weeks 1-4 aren't displayed

I've tried various combinations like directly specifiying the categories 

.CategoryAxis(axis => axis
                      .Categories("1", "2", "3", "4", "5", "6"....."52"))

and removing the categoryExpression in 

series.Line(model => model.Starts, categoryExpression: model => model.Week).Name("Starts");​

and it either doesn't show all the weeks, or puts values in the wrong category, or both.

 What's the right way to go about this?

 

[Iliana Dyankova]

Hi Michael,

In order to force the categories to start from week 1 you should manually sort the categories in the dataBound event: 

@(Html.Kendo().Chart(Model)
   //...
   .Events(ev => ev.DataBound("onDB"))
)
<script>
function onDB(e) {
   var chart = e.sender;
   chart.options.categoryAxis.categories.sort();
}
</script>

For your I prepared a dojo example (JavaScript version) which demonstrates the suggested approach in action. 

Regards,
Iliana Nikolova
Telerik