How do I use ViewBag as a datasource for an igDataChart
I need to make a line chart with 3 series
I already use model on the page
Hello Sandoy,
Thank you for posting in our community!
Before proceeding with preparing a sample regarding your question I have the following note: it is recommended to pass complex data structures by using the model and not by viewbag since the code is easier to maintain and more flexible to change further.
Extending the existing model with properties containing information for the chart is a possible implementation.
If you have already considered that option and view bag usage fits better the specificity of your case please let me know.
Looking forwards to hearing from you.
Dim dt2 As New DataTable()
Dim dcGruppe1 As New DataColumn("Entre", GetType(Integer))
Dim dcGruppe2 As New DataColumn("Gratister", GetType(Integer))
Dim dcGruppe3 As New DataColumn("Medlemsslusen", GetType(Integer))
Dim dcDato As New DataColumn("Uge", GetType(String))
dt2.Columns.Add(dcDato)
dt2.Columns.Add(dcGruppe1)
dt2.Columns.Add(dcGruppe2)
dt2.Columns.Add(dcGruppe3)
depending on the length of the period the graph use dates or week numbers on the x-axis
I would prefer to use viewbag for this graph
If I try this :
Html.Infragistics().DataChart(ViewBag.Data_Dage).ID("Graf_Dage").Width("1100px").Height("600px").DataBind().Render();
I get this error :
Typeargumenterne for metoden 'Infragistics.Web.Mvc.InfragisticsSuite<Intranet.mvc.Models.m_Besogstal_Dato>.DataChart<T>(object)' kan ikke afledes fra brugen. Prøv at angive typeargumenterne eksplicit.
the Graph tries to use the model insted of the Viewbag
Have you tried .AsQueryable()?
Hello Christian,
I am glad that you have been able to resolve your issue. If any additional questions arise don’t hesitate to contact me again.
I missed this JavaScript in my view
<script src="~/Scripts/IG/infragistics.dv.js"></script>
now it is working
Thank you for your patience.
One possible implementation is assigning AsQueryable list to the viewbag in the controller and then creating IEnumerable object in the view which fetches the information from the viewbag.
[controller]
public ActionResult Index()
{
List<StockMarketDataPoint> stockMarketData = new List<StockMarketDataPoint>
{…}
ViewBag.Chart = stockMarketData.AsQueryable();
return View();
}
[view ]
@{IEnumerable<StockMarketDataPoint> list = ViewBag.Chart;
@(Html.Infragistics().DataChart(list.AsQueryable()).ID("chart")
.Axes(axes =>
axes.CategoryX("xAxis");
axes.NumericY("priceAxis");
)
.Series(series =>
series.Financial("finSeries").XAxis("xAxis").YAxis("priceAxis")
.OpenMemberPath(item => item.Open)
.CloseMemberPath(item => item.Close)
.LowMemberPath(item => item.Low)
.HighMemberPath(item => item.High)
.VolumeMemberPath(item => item.Volume);
.DataBind()
.Render());
A sample is attached for your reference. Feel free to modify it and use it in your projects if needed.
If you need any additional assistance or if you have any further questions or concerns please let me know.
When I define an axis I get this error
Unhandled exception at line 23, column 21580 in http://localhost:55339/Scripts/IG/modules/infragistics.dvcommonwidget.js
0x800a01b6 - Der opstod en JavaScript-kørselsfejl: Objektet understøtter ikke egenskaben eller metoden 'name'
this line is marked :
;axis.name(val.name)
List<Intranet.mvc.Models.m_Besogstal_Uger> listen = ViewBag.Data_Uge;@(Html.Infragistics().DataChart(listen.AsQueryable()).ID("Graf_Uge").Width("1100px").Height("600px").Axes(axes =>{axes.NumericX("xAxis");axes.NumericY("yAxis");}).Series(series =>{series.Line("Entre").XAxis("xAxis").YAxis("yAxis").ValueMemberPath(item => item.Entre).ShowTooltip(true).TooltipTemplate("tooltipTemplate1").Thickness(5);series.Line("Gratister").XAxis("xAxis").YAxis("yAxis").ValueMemberPath(item => item.Gratister).ShowTooltip(true).TooltipTemplate("tooltipTemplate2").Thickness(5);}).DataBind().Render())
I change the datatable to a list
Thank you for your reply.
In order to be bound to the igDataChart data should be passed in one of the following formats: JSON, XML, JavaScript array or IQueryable<T> in ASP.NET MVC. Data structure in datatable is not a supported format. More information on requirements for igDataChart data binding could found at the following link: http://help.infragistics.com/Help/NetAdvantage/jQuery/2012.1/CLR4.0/html/igDataChart_DataBinding.html#_Ref321140964
If you have any additional questions regarding this issue feel free to contact us.