Display Top N Categories

2 posts, 0 answers
  1. Jim Collier
    Jim Collier avatar
    4 posts
    Member since:
    Oct 2003

    Posted 31 Dec 2015 Link to this post

    I have a bar chart (see attached), that I would like to display only the top 10 categories in order by alarm count.  I cannot see a way to only display top N number of categories. This this possible with the bar chart? 

    Here is the code.

                 

    01.@(Html.Kendo().Chart<Swisslog.DC.Entities.AlarmActivity>()
    02.    .Name("alarmsTop10Last30")
    03.    .Title(title => title.Text("TOP 10 ALARMS THE LAST 7 DAYS").Font("bold 30px Arial,Helvetica,sans-serif").Color("#808080").Align(ChartTextAlignment.Left))
    04.    .Legend(legend => legend
    05.        .Visible(false)
    06.        .Position(ChartLegendPosition.Top)
    07.        .Font("bold 18px Arial,Helvetica,sans-serif").Color("#808080")
    08.    )
    09.    .AutoBind(true)
    10.    .DataSource(ds => ds
    11.        .Read(read => read.Action("AlarmsKPIHistory", "Home"))
    12.        .Group(group => group.Add(model => model.AlarmCode))
    13.    //.Aggregates(agg => agg.Add(model => model.AlarmID).Count())
    14.    //.Sort(sort => sort.Add(model => model.AlarmCode).Ascending())
    15.    //.PageSize(10)
    16.    )
    17.    .Series(series =>
    18.    {
    19.        //series.Bar(model => model.AlarmID).Name("Alarm Description").Aggregate(ChartSeriesAggregate.Count).Color("#ED7D31");
    20.        //series.Bar(model => model.AlarmID).Name("#= group.value #").Aggregate(ChartSeriesAggregate.Count).Color("#ED7D31").Stack("AlarmDescription");
    21.        //series.Bar(model => model).Name("").Aggregate(ChartSeriesAggregate.Count).Color("#ED7D31");
    22.        series.Bar(model => model.AlarmID).Name("1").Aggregate(ChartSeriesAggregate.Count).CategoryField("AlarmDescription");
    23.    })
    24.    .CategoryAxis(axis =>
    25.    {
    26.        //.Categories(model => model.AlarmDateTime)
    27.        //.Title(title => title.Text("Date").Font("bold 18px Arial,Helvetica,sans-serif").Color("#000000"))
    28.        axis.Labels(labels => labels.Rotation(0).Font("bold 18px Arial,Helvetica,sans-serif").Color("#808080"));
    29.        axis.MajorGridLines(lines => lines.Visible(false));
    30.        axis.Axis.BaseUnit = ChartAxisBaseUnit.Fit;
    31.        axis.Axis.MaxDateGroups = 5;
    32.        axis.Axis.Type = ChartCategoryAxisType.Category;
    33.    })
    34.    .ValueAxis(axis => axis
    35.        .Numeric()
    36.        .Labels(labels => labels.Format("{0:N0}").Font("bold 18px Arial,Helvetica,sans-serif").Color("#808080"))
    37.        .Title(title => title.Text("Alarm Count").Font("bold 18px Arial,Helvetica,sans-serif").Color("#000000"))
    38.        .Max(100)
    39.        .MajorUnit(10)
    40.        .MajorGridLines(major => major.Visible(true))
    41.        .Line(line => line.Visible(false))
    42.    )
    43.    .Tooltip(tooltip => tooltip
    44.        .Visible(true)
    45.        .Format("{0:N0}")
    46.    )
    47.    .Events(events => events
    48.        .DataBound("onDataBound_alarmsResponds1")
    49.    )
    50.)


     

     

     

  2. Iliana Nikolova
    Admin
    Iliana Nikolova avatar
    2595 posts

    Posted 04 Jan Link to this post

    Hi Jim,

    This scenario is not supported out-of-the-box by Kendo UI Chart. As a workaround I would suggest filtering the dataSource. As an example:
    .DataSource(ds => ds
       .Read(read => read.Action("AlarmsKPIHistory", "Home"))
       .Group(group => group.Add(model => model.AlarmCode))
       .Filter(filter => filter.Add(model => model.AlarmID).IsGreaterThan(30))
    )


    Regards,
    Iliana Nikolova
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  3. UI for ASP.NET MVC is VS 2017 Ready
Back to Top