This is a migrated thread and some comments may be shown as answers.

Line Chart Configuration for AJAX using Razor

3 Answers 124 Views
Chart
This is a migrated thread and some comments may be shown as answers.
Steven
Top achievements
Rank 1
Steven asked on 20 Oct 2014, 09:59 PM
I haven't been able to figure out how to set the series with a data source returned from a controller (see below). What do I need to pass to series.Line()?

The controller method returns a list of long integers.

        @(Html.Kendo().Chart()
            .Name("jobHistoryChart")
            .Title("Batch Job History")
            .Theme("Bootstrap")
            .Legend(legend => legend.Visible(true).Position(ChartLegendPosition.Bottom))
            .HtmlAttributes(new
            {
                style = "margin-top:15px; border:thin solid steelblue; padding:10px; padding-bottom:20px;"
            })
            .DataSource(dataSource => dataSource.Read(read => read.Action("GetBatchJobHistory", "Home",
                new { histJobCaption = "Load Inventory Usage Summary Data" })))
            //.Series(series =>
            //{
            //    series.Line().Name("Batch Job");
            //})

        )

3 Answers, 1 is accepted

Sort by
0
Hristo Germanov
Telerik team
answered on 22 Oct 2014, 07:27 AM
Hello Steven,

The best way to do this is to bind your chart to list of objects. Please follow this online example.

Regards,
Hristo Germanov
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
0
Steven
Top achievements
Rank 1
answered on 25 Oct 2014, 12:49 AM
Thank you. That example was helpful. But now I'm trying to dynamically pass the histJobCaption using a JavaScript function, as shown in the code below. But when this runs, I get a "Cannot assign lambda expression to anonymous type property" error. Is there a way around this, or do I need an entirely different approach?

@(Html.Kendo().Chart<AXBatchJobMonitorMvc.Models.BatchJobRunTime>()
.Name("jobHistoryChart")
.Title("Batch Job Performance")
.Theme("Silver")
.Legend(legend => legend.Visible(true).Position(ChartLegendPosition.Bottom))
.HtmlAttributes(new
{
style = "margin-top:10px; border:thin solid steelblue; padding:3px;"
})
.DataSource(dataSource => dataSource.Read(read => read.Action("GetBatchJobHistory", "Home",
new { histJobCaption = @<script>getCaption();</script> }))
.Group(g => g.Add(v => v.Group))
.Sort(s => s.Add(v => v.DateTimeString))
)
.Series(series =>
{
series.Line(model => model.RunTime).Name("#:group.value#");
})
.ValueAxis(axis => axis
.Numeric().Labels(labels => labels.Format("{0} min"))
)
.CategoryAxis(axis => axis
.Categories(model => model.DateTimeString)
)
.Tooltip(tooltip => tooltip
.Visible(true)
.Format("{0} min")
)
)
0
Hristo Germanov
Telerik team
answered on 28 Oct 2014, 08:29 PM
Hi Steven,

Unfortunately you can't pass a function as an additional parameter to read method. Please excuse us for the inconvenience that this may cause.

Regards,
Hristo Germanov
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
Tags
Chart
Asked by
Steven
Top achievements
Rank 1
Answers by
Hristo Germanov
Telerik team
Steven
Top achievements
Rank 1
Share this question
or