Legend Sort Order Issue

[Nate]

Hey Guys,

First, I want to say you guys did a great Job on Kendo UI, we are planing to upgrade from MVC extension to Kendo.
My issue is on the grouped line chart the legend is taking the default sort of the group data and showing as the attached image.
Is there a way to control the order on the legend?

<%= Html.Kendo().Chart<TestOrders>()
        .Name("Hl7Line")
        .Title("Number of NEW ORDERS PER HOUR BY MONTH  -  RUNNING TOTAL")
        .ChartArea(chartArea => chartArea.Background("transparent"))
        .Legend(legend => legend.Position(Kendo.Mvc.UI.ChartLegendPosition.Right))
        .DataSource(ds => ds
            .Read(read => read.Action("AJaxOrdersPerHourByMonth", "Dashboard"))
            .Group(group => group.Add(m => m.MonthName))
            .Sort(sort => sort.Add(m => m.Hour).Ascending())
        )
        .Series(series => series
            .Line(model => model.NumberOfOrders)
            .GroupNameTemplate("#= group.value #")
        )
        .CategoryAxis(axis => axis
            .Categories("12AM", "1AM", "2AM", "3AM", "4AM", "5AM", "6AM", "7AM", "8AM", "9AM", "10AM", "11AM", "12PM", "1PM", "2PM", "3PM", "4PM", "5PM", "6PM", "7PM", "8PM", "9PM", "10PM", "11PM")
            .Title("Hours of Day")
        )
        .ValueAxis(axis => axis
            .Numeric().Labels(labels => labels.Format("{0}"))
            .Title("Number of Orders")
        )
        .Tooltip(t => t.Visible(true).Format("{0}").Template("#=series.name# (#= value#)"))
        .Transitions(true)
    %>

[Nate]

Anybody has an answer or workaround for this issue?

[Vladimir Iliev]

Hi Netsanet,

 

You can set custom order of the groups for example by creating another field in your model which holds custom order number. Then you should create grouping by this field and get the label for the groups from the old field -  in your case MonthName. 


E.g.:

new StockDataPoint {
    Close = 544.1,
    Volume = 3522997,
    Open = 540,
    High = 544.1,
    Low = 538.51,
    MonthName = "Feb",
    //New order field
    MonthNumber = 2
}

.DataSource(dataSource => dataSource
            .Read(read => read.Action("_StockData", "Scatter_Charts"))
            .Group(group => group.Add(model => model.MonthNumber))
        )
        .Series(series => {
            series.Line(model => model.Close)
                .Name("close")
                .GroupNameTemplate("#= group.items[0].MonthName #");

Kind Regards,
Vladimir Iliev
the Telerik team

[Nate]

Hey Vladimir you rock!! it solved my problem, i didn't know you could use "group.items[0]" inside the the template.

Thanks