Click here to Skip to main content
15,881,588 members
Articles / Multimedia / GDI+

Create Pie Chart Using Graphics in C# .NET

Rate me:
Please Sign up or sign in to vote.
4.50/5 (15 votes)
12 Jan 2017CPOL3 min read 89.6K   4.7K   20   12
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. 

Image 1

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.  

C#
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:

C#
Graphics graphics = pictureBox1.CreateGraphics();  

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

C#
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:

C#
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.

C#
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.

C#
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;
   }
}

Image 2

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 "hari.19113@gmail.com".

Thank you. 

License

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


Written By
India India
This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.

Comments and Discussions

 
GeneralMy vote of 1 Pin
Member 1313602618-Apr-17 6:02
Member 1313602618-Apr-17 6:02 
GeneralRe: My vote of 1 Pin
hari1911318-Apr-17 18:18
hari1911318-Apr-17 18:18 
Bugresource leak Pin
sx200813-Jan-17 10:24
sx200813-Jan-17 10:24 
GeneralRe: resource leak Pin
hari1911315-Jan-17 16:14
hari1911315-Jan-17 16:14 
Generalgreat job Pin
elaznajib24-Nov-14 22:45
elaznajib24-Nov-14 22:45 
GeneralRe: great job Pin
hari1911321-Dec-14 22:19
hari1911321-Dec-14 22:19 
GeneralMy vote of 5 Pin
Anisuzzaman Sumon29-Jul-13 10:16
professionalAnisuzzaman Sumon29-Jul-13 10:16 
GeneralRe: My vote of 5 Pin
hari191133-Aug-13 21:16
hari191133-Aug-13 21:16 
GeneralMy vote of 3 Pin
VadimAlk24-Sep-12 21:07
VadimAlk24-Sep-12 21:07 
GeneralRe: My vote of 3 Pin
hari1911325-Sep-12 4:34
hari1911325-Sep-12 4:34 
GeneralMy vote of 5 Pin
Azim Zahir21-Sep-12 19:03
Azim Zahir21-Sep-12 19:03 
GeneralRe: My vote of 5 Pin
hari1911321-Sep-12 19:45
hari1911321-Sep-12 19:45 

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

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