Passing a Dictionary<int,Double> from Controller to view and access the dictionary values from View to display a chart

Question

I have a controller that Populates a dictionary with key as Month dates as 0,5,10,15,20,25,30 and the Values as some Distance covered for each period. Say for eg: Dictionary element of key 5 has distance covered between days 0 and 5 of that Month.

Dictionary<int, double> ChartDetails = getDetails.getFMS1DataSet(FMS1Resultset);

I need to know how can I pass this dictionary from Controller to View. In View I access them to display a chart of Number of Days VS distance covered. The Chart is SyncFusion User controls

@(Html.EJ().Chart("container")
          .PrimaryXAxis(pr => pr.Range(ra => ra.Min(2005).Max(2011).Interval(1)).Title(tl => tl.Text("Days")))
          .PrimaryYAxis(pr => pr.Title(tl => tl.Text("Fuel Usage")).RangePadding(ChartRangePadding.None)
          .LabelFormat("{value}%").Range(ra => ra.Min(25).Max(50).Interval(5)))
          .CommonSeriesOptions(cr => cr.Type(SeriesType.Line).EnableAnimation(true)
          .Marker(mr => mr.Shape(ChartShape.Circle).Size(sz => sz.Height(10).Width(10)).Visible(true)).Border(st => st.Width(2)))
          .Series(sr =>
              {
                  sr.Points(pt =>
                      {
                          pt.X("0").Y(0).Add();
                          pt.X("5").Y().Add();
                          pt.X("10").Y().Add();
                          pt.X("15").Y().Add();
                          pt.X("20").Y().Add();
                          pt.X("25").Y().Add();
                          pt.X("30").Y().Add();
                      }).Name("Fuel").Tooltip(sr1 => sr1.Visible(true).Template("Tooltip")).Add();

              })
          .CanResize(true)

Here for pt.X("5").Y().Add(); I want the Y parameter to be added as Dictionary elements

Answer 1

It is not possible to directly pass the dictionary values from view to controller as dictionary doesn't allow serialization of data. Hence we have created a view model class containing the dictionary type. The dictionary value is stored in the ViewBag in the controller and passed to the view for assigning values to the series Points. The X value in the chart should be of string type .Hence we have converted the integer Value to string. Y values are used as double . I have attached the sample link for your reference.

http://www.syncfusion.com/downloads/support/directtrac/general/ze/WebApplication11359635681