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

Dynamically create multiple LineSeries from DataTable

3 Answers 108 Views
Chart (HTML5)
This is a migrated thread and some comments may be shown as answers.
Jeff
Top achievements
Rank 1
Jeff asked on 22 Nov 2016, 08:46 PM

We're returning a datatable with which to create a line chart. The chart binds fine but we can't figure out how to dynamically create the individual series. These are database driven and can change over time so we don't want to hard code each series into the chart. Is there a way to take data from a bound datatable like the following and have the chart generate correctly?

Value          Date                User

3             2016-11-21          John 
5             2016-11-23          John  
1             2016-11-21          Mary  
1             2016-11-23         Mary 
3             2016-11-21         Tom 
2            2016-11-23          Tom 

The end result should be a line chart with three lines: one for John, one for Mary, one for Tom. The x-axis would be the dates and the y-axis would be the value. As mentioned, the User Names can change over time in the database so we don't want to hard code them into the chart lineseries if that can be avoided. Is there a way to have the lineseries generate automatically from the datatable that is being bound to the chart?

thanks,

Jeff

 

3 Answers, 1 is accepted

Sort by
0
Danail Vasilev
Telerik team
answered on 25 Nov 2016, 03:52 PM
Hi Jeff,

You can find a possible approach for grouping a data table in this code library - http://www.telerik.com/support/code-library/group-radhtmlchart-data-source

Regards,
Danail Vasilev
Telerik by Progress
Telerik UI for ASP.NET AJAX is ready for Visual Studio 2017 RC! Learn more.
0
Ralph
Top achievements
Rank 1
answered on 30 Nov 2016, 04:02 PM

This may help with what you need: users are able to select a province from a RadGrid. Upon selecting the province, a line is dynamically added to a RadHTMLChart (or dropped). Basically, I clear the chart PlotArea and add back the x-axis (this is a constant although the axis items change depending on the data table and the date range specified by the user). In your case it's the "Date" column in your data table. Then I add the selected series.

Private Sub AddSeries(sName, sDataField)
Dim chartSeries As New LineSeries
chartSeries.Name = sName
chartSeries.DataFieldY = sDataField
chartSeries.LabelsAppearance.Visible = False
chartSeries.MarkersAppearance.Visible = False
chartSeries.TooltipsAppearance.Visible = False
RadHtmlChart1.PlotArea.Series.Add(chartSeries)
End Sub

In your case you would specify the sName and sDataField both as "User". Hopefully this answers your question.

 

0
Jeff
Top achievements
Rank 1
answered on 30 Nov 2016, 07:46 PM

Thank you for both comments. They were helpful. We were able to get it to work with the grouping method for the data table.

 

thanks!

Tags
Chart (HTML5)
Asked by
Jeff
Top achievements
Rank 1
Answers by
Danail Vasilev
Telerik team
Ralph
Top achievements
Rank 1
Jeff
Top achievements
Rank 1
Share this question
or