Hi,
I have multiple data series bound to igDataChart as follows:
@(Html.Infragistics().DataChart(Model.Data) .Axes((axes) => { axes.NumericX("xAxis").Stroke("Black").StrokeThickness(4).MajorStroke("Whitesmoke"); axes.NumericY("yAxis").Stroke("Black").StrokeThickness(4).MajorStroke("Whitesmoke"); }) .Series(series => { series.ScatterLine("scatterSeries1", Model.DataSeries1) .XAxis("xAxis").YAxis("yAxis").MarkerBrush("Black") .XMemberPath(data => data.SpectralPoint) .YMemberPath(data => data.Wavelength) .ShowTooltip(true) .Thickness(5) .TooltipTemplate("tooltipTemplate"); }) .Series(series => { series.ScatterLine("scatterSeries2", Model.DataSeries2) .XAxis("xAxis").YAxis("yAxis").MarkerBrush("Black") .XMemberPath(data => data.SpectralPoint) .YMemberPath(data => data.Wavelength) .ShowTooltip(true) .Thickness(5) .TooltipTemplate("tooltipTemplate"); }) .Series(series => { series.ScatterLine("scatterSeries3", Model.DataSeries3) .XAxis("xAxis").YAxis("yAxis").MarkerBrush("Black") .XMemberPath(data => data.SpectralPoint) .YMemberPath(data => data.Wavelength) .ShowTooltip(true) .Thickness(5) .TooltipTemplate("tooltipTemplate"); }) .DataBind() .Render() )
Is there any way I can use loop to assign data series dynamically instead of assigning them one by one as I have shown above.
Hi, sanjaysutar
There is no way to assign data series dynamically with an MVC helper since the MVC helper renders JavaScript code server side and it is executed only once before the web page is received by the user. Also, there is no way to assign multiple series in a loop to an igDataChart control with an MVC helper.
You can satisfy both of these requirements if you use JavaScript to update a chart dynamically client side.
Cheers, Lazar
I'm trying to add series client side but it keeps saying: Uncaught TypeError: Cannot read property 'basedOnColumns' of undefined (infragistics.dvcommonwidget.js:24)Could you please help me with this?
My code that adds series to the chart looks like the one posted in this thread: http://ko.infragistics.com/community/forums/t/72419.aspxThe dataSource is an array with the series at the top with object like this:
function dataSerie(itemid) { this.ItemId = itemid; this.Measurements = []; this.RowCount = 0; this.Done = false;}
The Measurements array contains these kind of objects (downloaded by ajax in json):
History_ID: 935464ItemId: 1MeasureTime: "2012.03.20. 0:02:27"MeasureValue: 6.75
Should I give the whole datasource to the datachart and tell the series the correct path? Giving datasources one by one to new series could be handled nicer.
Thank you forward, Peter
That seems to be a major drawback then, because I might not know how many dataseries to use.
I have achieved that by below code:
@for (int j = 0; j < Model.DataCollection.Keys.Count; j++)
{ @(Html.Infragistics().DataChart(Model.Data.AsQueryable()) .ID("Chart") .Axes((axes) => { axes.NumericX("xAxis").Stroke("Black").StrokeThickness(4).MajorStroke("Whitesmoke"); axes.NumericY("yAxis").Stroke("Black").StrokeThickness(4).MajorStroke("Whitesmoke"); }) .Series(series => { series.ScatterLine("scatterSeries" + j.ToString(), Model.DataCollection[j].AsQueryable())
.XAxis("xAxis").YAxis("yAxis")
.XMemberPath(data => data.XVal) .YMemberPath(data => data.YVal) }) .DataBind() .Render() )
}
Here the key is the chart ID and Series ID (marked as bold in above code).
If we keep the ID same, looping will not create new charts but will use just one chart. Series ID needs to be different, so that charts do not get overwritten but coexist with other series.
Let me know if I am wrong in my approach.