Drawing a PIE chart in C# MVC application

Question

I have created a ASP.NET C# MVC3 project, and i need to display a PIE chart and populate it with values returned by the following controller;

My Controller ;

        public ActionResult Index()
        {
            var model = new TimeTrackerModel();
            model.TypeSchools = AllDataList.retrieveAlltypeSchool();
            return View(model);        

        }

The Model Type Schools will return the number of Primary, Secondary and Tertiary Schools in UK.

Now, i need to display these values in a PIE chart. How can draw a PIE chart according to the Values returned.

1.) How can i draw a PIE chart (I am unable to drag and drop the CHART tool from the toolbar) 2.) How can i populate the PIE chart with the values given from the controller.

I just googled your question : http://www.c-sharpcorner.com/UploadFile/krishnasarala/charts-for-Asp-Net-mvc-application/ — tafa, Mar 25 '13 at 09:32

score 0 · Answer 1 · answered Mar 25 '13 at 09:41

0

1) You will need js library for that purpose, I suggest Raphael: http://raphaeljs.com/pie.html

2) You may create custom view template for your model or simple view

answered Mar 25 '13 at 09:41

Dima

6,721
4
24
43

Can you recommend a good tutorial that will show how to populate the values to the pie chart? – Sharon Watinsan Mar 25 '13 at 09:51
Check out page sources of the example from reply. You'll need to copy html markup (table structure) on your page and ask Raphael to use it. – Dima Mar 25 '13 at 10:04

score 0 · Answer 2 · answered Mar 25 '13 at 09:58

0

You cannot drag and drop controls in mvc view pages. And how the chart is returned from an controller is specific to the tools or library used. There are numerous ways to draw chart: Some are

Microsoft Chart : MS Chart Samples from Code Project
pdfReport:Also uses MS Chart
High Chart: [Highchart] but is not free for non-commercial use3 Hence find their samples and documentations before selecting your best option.

answered Mar 25 '13 at 09:58

serene

685
6
16

You can only drag-n-drop HTML components and not Chart etc. – Sharon Watinsan Mar 25 '13 at 10:05

score 0 · Answer 3 · answered Mar 27 '13 at 05:33

0

You could also have a look at jqPlot which is a very popular js library for producing charts. E.g. Bargraphs, plots, pie charts, etc.

I suggest you look at Pie Charts on jqplots website. They also give you clear examples.

answered Mar 27 '13 at 05:33

Rob Waldron

41
2

Drawing a PIE chart in C# MVC application

3 Answers3