Line Chart - Data Grouping

3 posts, 0 answers
  1. Erik Stell
    Erik Stell avatar
    11 posts
    Member since:
    Dec 2013

    Posted 01 Aug Link to this post

    This is what I hope is a simple chart configuration issue, but after several hours of back and forth with the code, something is eluding me.

    I am creating a simple line chart that should display the count of specific errors over the course of a given date range.  The series should be the error message's themselves (ie, error 1, error 2, et al)

    The MVC controller is happily returning data back to me in this form:

    [
       {
          "ErrorMessage":"error 1",
          "ErrorCount":11,
          "ReportDate":"2016-06-01T00:00:00"
       },
       {
          "ErrorMessage":"error 1",
          "ErrorCount":12,
          "ReportDate":"2016-06-02T00:00:00"
       },
       {
          "ErrorMessage":"error 1",
          "ErrorCount":23,
          "ReportDate":"2016-06-03T00:00:00"
       },
       {
          "ErrorMessage":"error 1",
          "ErrorCount":1,
          "ReportDate":"2016-06-04T00:00:00"
       },
       {
          "ErrorMessage":"error 101",
          "ErrorCount":128,
          "ReportDate":"2016-06-01T00:00:00"
       },
       {
          "ErrorMessage":"error 101",
          "ErrorCount":137,
          "ReportDate":"2016-06-02T00:00:00"
       },
       {
          "ErrorMessage":"error 101",
          "ErrorCount":134,
          "ReportDate":"2016-06-03T00:00:00"
       },
       {
          "ErrorMessage":"error 101",
          "ErrorCount":43,
          "ReportDate":"2016-06-04T00:00:00"
       },
       {
          "ErrorMessage":"error 103",
          "ErrorCount":1,
          "ReportDate":"2016-06-01T00:00:00"
       },
       {
          "ErrorMessage":"error 103",
          "ErrorCount":3,
          "ReportDate":"2016-06-02T00:00:00"
       },
       {
          "ErrorMessage":"error 103",
          "ErrorCount":2,
          "ReportDate":"2016-06-03T00:00:00"
       },
       {
          "ErrorMessage":"error 103",
          "ErrorCount":1,
          "ReportDate":"2016-06-04T00:00:00"
       },
       {
          "ErrorMessage":"error 11",
          "ErrorCount":118,
          "ReportDate":"2016-06-01T00:00:00"
       },
       {
          "ErrorMessage":"error 11",
          "ErrorCount":100,
          "ReportDate":"2016-06-02T00:00:00"
       },
       {
          "ErrorMessage":"error 11",
          "ErrorCount":163,
          "ReportDate":"2016-06-03T00:00:00"
       },
       {
          "ErrorMessage":"error 11",
          "ErrorCount":32,
          "ReportDate":"2016-06-04T00:00:00"
       }
    ]

    It breaks out each type of error message by how many occurred for each day.  I would imagine that in order to get it to display correctly in the chart, a group option should be used, which I have tried:

    @(Html.Kendo().Chart<ErrorInfoModel>()
        .Name("errorChart")
        .Title("Errors")
        .Legend(legend => legend.Position(ChartLegendPosition.Top))
        .DataSource(ds => ds.Read(read => read.Action("GetErrorsByDays", "Metrics"))
            .Group(group =>{
                group.Add(model => model.ErrorErrorMessage);
            })
        )
        .Series(series =>
        {
            series.Line(model => model.ErrorCount, categoryExpression: model => model.ReportDate).Name("#= group.value #").Aggregate(ChartSeriesAggregate.Count);
        })
        .CategoryAxis(axis => axis.Categories(model => model.ReportDate).Date().BaseUnit(ChartAxisBaseUnit.Days))
        .ValueAxis(axis => axis.Numeric().Line(line => line.Visible(true)).AxisCrossingValue(-10)
    ))
                        

    However, after several permutations of group, aggregates, etc I still cannot get the chart to display the data.  I can only assume that there is something really simple I am missing, or else the structure of my returned data is not suitable for what I am trying to do.

    Thanks in advance!

     

  2. Erik Stell
    Erik Stell avatar
    11 posts
    Member since:
    Dec 2013

    Posted 01 Aug in reply to Erik Stell Link to this post

    Ack.  Pay no attention to the typo in the chart portion:

           .Group(group =>{
                group.Add(model => model.ErrorErrorMessage);
            })

    that was a result of some search replace.  It is correct in the actual implented code, and should read

           .Group(group =>{
                group.Add(model => model.ErrorMessage);
            })

  3. Kendo UI is VS 2017 Ready
  4. Erik Stell
    Erik Stell avatar
    11 posts
    Member since:
    Dec 2013

    Posted 01 Aug in reply to Erik Stell Link to this post

    Of course it figures:  10 minutes after I post the question, I figured it out.  It was the presence of my categoryExpression and Aggregate settings.  Once I removed them, it worked

    *sigh*

Back to Top