Graphs won't display remote data.

3 posts, 0 answers
  1. Chris
    Chris avatar
    2 posts
    Member since:
    Feb 2015

    Posted 24 Mar 2015 Link to this post

    I must have a setting incorrect or am missing something arbitrary. I can't get graphs to work with remote data. If I hard-code data in, all is well. If I use a grid with remote data, things are fine. But graphs with remote data produce an empty graph. What am I missing?

    <div>
        @*Graph with Remote Data -- Doesn't work!*@
        @(Html.Kendo().Chart<Convergent.Web.Models.JDL.JDLModel>()
            .Name("jdlGraphRemote")
            .DataSource(ds => ds
                .Read(r => r.Action("JDLRead", "JDL"))
            )
            .Series(series =>
            {
                series.Line(c => c.InfluenceStyleTotalDPct);
            })
        ) 

        @*Graph with Direct Data -- WORKS!*@
        @(Html.Kendo().Chart<Convergent.Web.Models.JDL.JDLModel>()
            .Name("jdlGraphDirect")
            .DataSource(ds => ds
                .Read(r => r.Action("JDLRead", "JDL"))
            )
            .Series(series =>
            {
                series.Line(new double[] { 30, 0, 13, 55, 35, 0, 42, 65, 0, 0, 7, 85, 28, 35, 68, 45, 0, 42, 68, 40, 96, 58, 5, 68, 58, 75 });
            })
        )

        @*Grid with Remote Data -- WORKS!*@
        @(Html.Kendo().Grid<Convergent.Web.Models.JDL.JDLModel>()
            .Name("jdlGridRemote")
            .DataSource(ds => ds
                .Ajax()
                .Read(r => r.Action("JDLRead", "JDL"))
            )
            .Columns(columns =>
            {
                columns.Bound(c => c.InfluenceStyleTotalDPct);
            }) 
        )
    </div>

  2. Chris
    Chris avatar
    2 posts
    Member since:
    Feb 2015

    Posted 24 Mar 2015 in reply to Chris Link to this post

    ...and by "graphs" I mean "charts"... sorry about that.
  3. Daniel
    Admin
    Daniel avatar
    2230 posts

    Posted 26 Mar 2015 Link to this post

    Hello Chris,

    The problem will occur when loading the data from the same action for the grid and the chart because the DataSources of the Chart and the Grid MVC wrappers expect a different response. The Grid DataSource expects a DataSourceResult and the Chart DataSource expects the collection to be returned directly.
    You should either use a different action method for the chart that returns directly the data or use the Custom builder for the Chart DataSource to specify that the data should be loaded from a field with name "Data" e.g.
    @(Html.Kendo().Chart<Convergent.Web.Models.JDL.JDLModel>()
        .Name("jdlGraphRemote")
        .DataSource(dataSource=> dataSource
            .Custom()
            .Schema(schema => schema
                .Data("Data")
            )
            .Transport(transport => transport
                .Read(read => read.Action("JDLRead", "JDL").Type(HttpVerbs.Post))
            )
        )
        .Series(series =>
        {
            series.Line(c => c.InfluenceStyleTotalDPct);
        })
    )


    Regards,
    Daniel
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
Back to Top