Click here to Skip to main content
Click here to Skip to main content
Go to top

Create Pie Chart Using Graphics in C# .NET

, 21 Sep 2012
Rate this:
Please Sign up or sign in to vote.
This article shows how to create a Pie chart using the Graphics class in C#.

Introduction

This program is used to create a pie chart using the Graphics class in C#. I have made it as good as I can, but if anyone has any suggestions please share it so we can all learn. 

Using the code 

Recently I have been fascinated by the graphics class and I was just experimenting  I came upon DrawPie() and FillPie() method of the Graphics class.

For a simple demo I have created a form with five textboxes, a button, and a picturebox and we are going to create a pie chart in this picturebox. 

Before creating a pie chart we must always keep in mind that we can't create a circle out of normal measurements. To create a circle we need values in degrees.

To convert into degrees first we will sum up all the values, i.e., calculate total sum  of all values in all the textboxes and then divide the each values with total and then multiply with 360.  

int i1 = Int32.Parse(textBox1.Text);
int i2 = Int32.Parse(textBox2.Text);
int i3 = Int32.Parse(textBox3.Text);
int i4 = Int32.Parse(textBox4.Text);
int i5 = Int32.Parse(textBox5.Text);

float total = i1 + i2 + i3 + i4 + i5 ;

float deg1 = (i1 / total) * 360;
float deg2 = (i2 / total) * 360;
float deg3 = (i3 / total) * 360;
float deg4 = (i4 / total) * 360;
float deg5 = (i5 / total) * 360;

After converting values we will create an instance of graphics class:

Graphics graphics = pictureBox1.CreateGraphics();  

After this we will create a rectangular area in which we will create the pie chart:

float deg1 = (i1 / total) * 360;
Rectangle rect = new Rectangle(0, 0, 150, 150);

First two parameters specify the drawing points. I.e., the X and Y co-ordinates and the third and fourth parameter specifies the size of the rectangle and in this case it will determine the size of our pie chart.

If you have observed every sections in pie chart are indicated by different colors. So we are going to do the same we will create five different brush:

Brush brush1 = new SolidBrush(Color.Red);
Brush brush2 = new SolidBrush(Color.Blue);
Brush brush3 = new SolidBrush(Color.Maroon);
Brush brush4 = new SolidBrush(Color.Navy);
Brush brush5 = new SolidBrush(Color.YellowGreen);
graphics.Clear(pictureBox1.BackColor);

Now to create our pie chart. Now graphics.FillPie(); accepts four parameters:

  1. Brush: Brush to fill the section which we have specified in brush.
  2. Rectangle: Rectangle area where the particular pie will be created.
  3. StartAngle: The start point from where to start the pie chart.
  4. SweepAngle: The point till where pie chart will be created.

Basically graphics.FillPie(); never creates a full pie diagram it just creates a section(arc) of pie diagram and we will create sequence of sections to make it look like pie chart.

graphics.FillPie(brush1, rect, 0, deg1);
graphics.FillPie(brush2, rect, deg1, deg2);
graphics.FillPie(brush3, rect, deg1 + deg2, deg3);
graphics.FillPie(brush4, rect, deg1 + deg2 + deg3, deg4);
graphics.FillPie(brush5, rect, deg1 + deg2 + deg3 + deg4, deg5);

In the above lines first line will create the first section with red color and its start point will be 0 and it will create an arc of calculated degrees.

After that our section (arc)  should start from where it left so the next line we have written deg1 at start angle and in third line we have written deg1+deg2 so that our next arc will start from where our previous arc has left. 

This particular code is not optimized one as you can see we  have created five different brush and five different float variables as these things could been done using loops. 

I intentionally didn't do it till this point because it may complicate matters for some. Below is the optimized code doing the above task using loops and arrays.

private void createPie()
{
   iarrPieValues = new int[lstValuesCount];

   for (int iCnt = 0; iCnt < lstValuesCount; iCnt++)
   {
       iarrPieValues[iCnt] = Int32.Parse(lstValues.Items[iCnt].ToString());
       sum += iarrPieValues[iCnt];
   }

   Color[] color = { Color.Red, Color.Blue, Color.Maroon, Color.Yellow, Color.Green, Color.Indigo };
   Rectangle rect = new Rectangle(30, 10, 130, 130);

   Graphics graphics = pictureBox1.CreateGraphics();
   graphics.Clear(pictureBox1.BackColor);

   float fDegValue = 0.0f;
   float fDegSum = 0.0f;

   for (int iCnt = 0; iCnt < iarrPieValues.Length; iCnt++)
   {
       fDegValue = (iarrPieValues[iCnt] / sum) * 360;
       Brush brush = new SolidBrush(color[iCnt]);
       graphics.FillPie(brush, rect, fDegSum, fDegValue);
       fDegSum += fDegValue;
   }
}

First I have created an array of int with range as the count of values in listbox. After that I have loop to calculate sum of all values.

Second I have created an array of colors here I have restricted user to not create a pie chart with more than 6 values as more values means pie chart will not look like one.

Thirdly we have used loop to create the pie chart conversion of numbers to degrees is done inside the loop fDegValue is created to calculate the degrees. In our previous example  we have sumed the previous values as provided it as the third parameter here we have done it with a slight difference that  fDegSum holds the sum values. 

This is just a small article to create a pie chart using the Graphics class. For those looking for creating charts professionally may use the chart controls provided by .NET and chart controls are part of .NET 4.0 and people using previous versions can download the controls from Microsoft's website. 

Suggestion 

Have any suggestion then do inform me at "hari19113@rediffmail.com".

Thank you. 

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Share

About the Author

hari19113

India India
No Biography provided

Comments and Discussions

 
GeneralMy vote of 5 PinmemberAnisuzzaman Sumon29-Jul-13 10:16 
GeneralRe: My vote of 5 Pinmemberhari191133-Aug-13 21:16 
GeneralMy vote of 3 PinmemberVadimAlk24-Sep-12 21:07 
GeneralRe: My vote of 3 Pinmemberhari1911325-Sep-12 4:34 
GeneralMy vote of 5 PinmemberAzim Zahir21-Sep-12 19:03 
GeneralRe: My vote of 5 Pinmemberhari1911321-Sep-12 19:45 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Mobile
Web01 | 2.8.140916.1 | Last Updated 21 Sep 2012
Article Copyright 2012 by hari19113
Everything else Copyright © CodeProject, 1999-2014
Terms of Service
Layout: fixed | fluid