MVC Experts:

I went through help.infragistics.com/.../igDataChart_Adding.html and added it to my working MVC web application, which currently queries data and displays charts with the windows mvc chart visualization library. I wanted to implement this example to have a proof of concept so that I could transition all of the charts in my web application to infragistics, so that they are better looking and more interactive for financial analysts using the data.

Unfortunately after going through the entirety of the example very carefully, I was riddled with errors when I tried to view the chart in the browser. Not Build errors: see at end.

Upon these errors, I went over to another team of developers at my company that have used infragistics MVC for some other projects, and they gave me some of their sample code. The only key difference was that they were using a view model to render the data IQueryable. Also, another key difference between what I am doing and the Infragistics reference is that I am using razor (.cshtml) for the viewer. But I am familiar with the syntax, and I think I made the appropriate changes from the ASPX that was in the view originally. 

The models and controller and viewer are all in the proper locations; that is not an issue. 

here is the code: 

Index.cshtml:

@using Infragistics.Web.Mvc
@using JBHunt.Eagle.Utilities.Server
@using JBHunt.Eagle.Utilities
@using System.Data
@using System.Data.OleDb
@using System.Linq
@model EAGLEWebPages.Models.StockMarketViewModel

@(Html.Infragistics().DataChart(Model.chart)
.ID("chart")
.Width("500px")
.Height("500px")
.CrosshairVisibility(Visibility.Visible)
.Axes(axes =>
{
axes.CategoryX("xAxis").Label(item => item.DateString).Stroke("rgba(0, 0, 0, 0.5)").StrokeThickness(5).Interval(1);
axes.NumericY("priceAxis").Stroke("rgba(0, 0, 0, 0.5)").StrokeThickness(5).Strip("rgba(0, 0, 0, 0.1)");
axes.NumericY("volumeAxis").LabelVisibility(Visibility.Collapsed).Stroke("rgba(0, 0, 0, 0.5)").MajorStroke("rgba(0, 0, 0, 0)");
}
)
.Series(series =>
{
series.Financial("finSeries").Title("Price Movements").XAxis("xAxis").YAxis("priceAxis")
.OpenMemberPath(item => item.Open).CloseMemberPath(item => item.Close).LowMemberPath(item => item.Low).HighMemberPath(item => item.High)
.Brush("rgba(0, 255, 255, 1)").NegativeBrush("rgba(0, 0, 0, 0.7)").Legend(legend => legend.ID("legend"));
series.Line("volumeSeries").Title("Sales Volume").XAxis("xAxis").YAxis("volumeAxis")
.ValueMemberPath(item => item.Volume).MarkerType(MarkerType.Circle).Brush("rgba(255, 0, 0, 1)").MarkerBrush("rgba(255, 0, 0, 1)")
.TrendLineType(TrendLineType.ModifiedAverage).TrendLineBrush("rgba(0, 100, 0, 1)").TrendLineThickness(3).Legend(legend => legend.ID("legend"));
}
)
.DataBind()
.Render()
)

@(Html.Infragistics().Loader()
.ScriptPath(Url.Content("~/Scripts/ig/"))
.CssPath(Url.Content("~/Content/ig/"))
.Render()
)

StockMarketViewModel.cs:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using EAGLEWebPages.Models;

namespace EAGLEWebPages.Models
{
public class StockMarketViewModel
{
public IQueryable chart { get; set; }
}
}

StockMarketChartModel.cs:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Infragistics.Web.Mvc;

namespace EAGLEWebPages.Models
{
public class StockMarketChartModel
{
public double Open { get; set; }
public double High { get; set; }
public double Low { get; set; }
public double Close { get; set; }
public double Volume { get; set; }
public DateTime Date { get; set; }
public string DateString { get { return Date.ToShortDateString(); } }
}
}

StockMarketController.cs:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web.Mvc;
using Infragistics.Web.Mvc;
using EAGLEWebPages.Models;

namespace EAGLEWebPages.Controllers
{
public class StockMarketController : Controller
{
public ActionResult Index()
{
List stockMarketData = new List
{
new StockMarketChartModel { Date = DateTime.Parse("2.1.2010"), Open = 1000, High = 1028.75, Low = 985.25, Close = 1020, Volume = 1995 },
new StockMarketChartModel { Date = DateTime.Parse("3.1.2010"), Open = 1020, High = 1032.5, Low = 999.5, Close = 1021, Volume = 1964.5 },
new StockMarketChartModel { Date = DateTime.Parse("4.1.2010"), Open = 1021, High = 1033.5, Low = 996, Close = 1033, Volume = 1974.75 },
new StockMarketChartModel { Date = DateTime.Parse("5.1.2010"), Open = 1033, High = 1062, Low = 1018.75, Close = 1042, Volume = 1978.5 },
new StockMarketChartModel { Date = DateTime.Parse("6.1.2010"), Open = 1042, High = 1058.5, Low = 1019.75, Close = 1029, Volume = 1979 },
new StockMarketChartModel { Date = DateTime.Parse("7.1.2010"), Open = 1029, High = 1050.75, Low = 1006, Close = 1042, Volume = 1990 }
};

return View(stockMarketData);
}

}
}

THE ERROR IN THE BROWSER (NO BUILD ERRORS):

The model item passed into the dictionary is of type 'System.Collections.Generic.List`1[EAGLEWebPages.Models.StockMarketChartModel]', but this dictionary requires a model item of type 'EAGLEWebPages.Models.StockMarketViewModel'.

if you are having trouble copying and pasting code into visual studio, let me know and I will update the post. 

also as far as file structure goes. eaglewebpages is the name of the solution. models are in Models, controllers in Controllers, etc. 

thanks for the help in advance. I have seen similar problems like this online with this example/tutorial (help.infragistics.com/.../igDataChart_Adding.html) but i have not seen a definite solution. Again i am trying to test the mvc part of the example NOT the HTML

reward to the first person to solve this