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

MVC Build Chart in the Controller

3 Answers 157 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Robert
Top achievements
Rank 1
Robert asked on 20 Aug 2013, 07:37 PM
Is it possible to build a Chart in the MVC Control and pass it to the View in the Model?  I want to do this so that I can dynamically display a chart based on the desired dashboard layout.  So I want the View to dictate where the charts are displayed but I want the View to be ignorant of the reports content.  Let me know if I haven't explained what I want to do well enough or if there is a better way.  I plan to have the dashboard layouts and which reports those contain stored in a database.

This is a "mark up"
View
@model ChartCollection
@{
    ViewBag.Title = "Dashboard";
}
<h2>
    Dashboard
</h2>
@Html.Partial("_Report1", Model["ValidationResults"])
@Html.Partial("_Report2", Model["ClientComponents"])

ChartCollection(Model)
public class ChartCollection : Dictionary<string, IChart>
{
}
Controller
01.public class HomeController : Controller
02.{
03.    public ActionResult Index()
04.    {
05.        ViewBag.Message = "Welcome to ASP.NET MVC!";
06. 
07.        return View();
08.    }
09. 
10.    public ActionResult About()
11.    {
12.        ChartCollection charts = new ChartCollection();
13. 
14.        IChart chart;
15. 
16.        /// How do I duplicate this logic in the Controller?
17.         @(Html.Kendo().Chart()
18.            .Name("ClientComponents")
19.            .Title("Components")
20.            .DataSource(ds =>
21.                    {
22.                        ds.Model(model =>
23.            {
24.                            foreach (DataColumn col in Model.QueryResults.Columns)
25.                            {
26.                                model.Field(col.ColumnName, col.DataType);
27.                            }
28.                        });
29.                    }
30.            )
31.        .Legend(legend => legend.Visible(true).Position(ChartLegendPosition.Bottom))
32.        .Series(series => series.Bar(new int[] {2,4,6}).Name("MyValues"))
33.        .CategoryAxis(yaxis => yaxis.Categories(new string[] {"Hello", "World"}))
34.        .Tooltip(tip => tip.Visible(true)) )
35. 
36.        /// Add the IChart to the ChartCollection
37.        charts.Add(chart.Name, chart)
38.        return View(charts);
39.                }
40.            }

3 Answers, 1 is accepted

Sort by
0
T. Tsonev
Telerik team
answered on 22 Aug 2013, 12:57 PM
Hello,

The helper methods are designed to be used within a view. You might be able to construct the widgets by initializing their properties directly, but they're not designed to be used like that.

Our recommendation is to store the widget configuration in a dedicated view model and construct the widget from it. This also maintains the View-Controller separation inherent to the MVC framework.

For example:

    .Title(Model.Title)
    .Series(series => {
        foreach (var s in Model.Series)
        {
            series.Bar(s.Field).Name(s.Name);
        }
    })


I hope this helps.

Regards,
T. Tsonev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Robert
Top achievements
Rank 1
answered on 22 Aug 2013, 01:21 PM
Are there objects in the framework that I can use as container object in the Model or do I have to build my own?
0
T. Tsonev
Telerik team
answered on 23 Aug 2013, 11:21 AM
Hello,

Well, not really, but the ViewBag is usually a good fit for unstructured data.

Regards,
T. Tsonev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
General Discussions
Asked by
Robert
Top achievements
Rank 1
Answers by
T. Tsonev
Telerik team
Robert
Top achievements
Rank 1
Share this question
or