Create Radar chart from Database

Last I was asked to create a proof of concept for creating a radar chart based on some scores a user got on a test. The test is devided in categories and for each category the user gets a score.

First I created the database and it looked like this:


With this database I tried to create a radar chart via the Microsoft Reports (created via design mode in Visual Studio 2012). But there I had not much luck creating the chart. Whatever configuration I tried, the chart was never wat I expected it to be. After a while I gave up creating the chart via the design mode and tried to create the chart in code. Here I was more lucky.

The code to create the chart for this database looked like this:

var xValues = new string[] { "Category1", "Category2", "Category3", "Category4", "Category5", "Category6" };
using (var ctxt = new SoftwareFactory_ChartingEntities())
    var data = ctxt.Results.Select(x => x);
    foreach (var dataItem in data.Select(x => x.UserName).Distinct())
        var dataForUser = data.Where(x => x.UserName.Equals(dataItem));
        foreach (var userItem in dataForUser)
            var yValues = new List();
            Chart1.Series[dataItem].Points.DataBindXY(xValues, yValues);
            Chart1.Series[dataItem].ChartType = SeriesChartType.Radar;
            Chart1.Series[dataItem].IsValueShownAsLabel = true;
            Chart1.Series[dataItem].IsValueShownAsLabel = true;
            Chart1.Series[dataItem].ChartType = SeriesChartType.Radar;
            Chart1.Series[dataItem].Color = GetRandomColor();
            Chart1.Series[dataItem].BorderWidth = 2;
            Chart1.Series[dataItem]["AreaDrawingStyle"] = "Polygon";
            Chart1.Series[dataItem]["RadarDrawingStyle"] = "Line";

Chart1.ImageType = System.Web.UI.DataVisualization.Charting.ChartImageType.Jpeg;
Chart1.ChartAreas.Add(new ChartArea());
Chart1.ChartAreas[0].Area3DStyle.Enable3D = false;

Chart1.ChartAreas[0].AxisX.MajorGrid.LineColor = System.Drawing.Color.LightGray;
Chart1.ChartAreas[0].AxisY.MajorGrid.LineColor = System.Drawing.Color.LightGray;

When running the application (in my case a website) the chart looked like this:


After succeeding in creating the chart programmatically I tried again with the Visual Studio Reporting. And suddenly I found my mistake. The problem was not in the configuration, the problem was in the database.

Apperently the VS Reporting cannot handle it when each category is another column in the database. I recreated the database in another way so that my database looked like this:


And voila. My problem was solved.

My designer configuration looked like this:



So do not always blame the Reporting itself (like I did). In my case it was the database.

Hopefully this post will help you shorten your search for a solution.

3 thoughts on “Create Radar chart from Database

  1. Dear Cedric,

    I am a teacher who want to use a radar chart and print it on students’ report card.

    Is there any possibility that you can share the VS package?

    Thanks for your time.


    1. Hey John,

      I’m sorry for the inactivity for last year. But I’m back to blogging and I just saw your comment.
      Do you still need this package? I will certainly create you a new example.


  2. Hi Cedric,
    I have a website where i need to create a Radar chart which will be filled with data from database. I used Microsoft.chart.controls to make it. I was successful in doing that.
    But when i used your code i got a lot of “missing directives” error.
    So i want to know what references you have used for SoftwareFactory_ChartingEntities(), GetRandomColor() etc.
    Can you help me with that?

Leave a Reply

Your email address will not be published. Required fields are marked *