Easy way to plot graphs with C# and Visual Studio 2010

Ola, amigos! Here I am again to another tutorial. This time I’m going to give you a brief tutorial teaching you how to plot graphs using a component called Chart, its recommended for you to take a look at its documentation before.

Well, for almost for years developing in C#, last month was the first time I ended up drawing graphs in an application I’m developing. After a couple of hours looking at the internet, I found an easy way to do it. You only need to add the coordinates, x and y, or only one of those and that’s it. It’s done!

So, here we go!
I’ll go through this step-by-step by the way.

I first created a new application, added a button and the Chart component.

It looked like this.

So, before start coding, let’s create a collection. But, what is a collection? In simple words, a collection is your graph, the Chart component gives you the opportunity to plot more than one graph in the same place, thus a collection is a list of coordinates that you be shown to you.

Go to the Chart property called Series and add a new collection.
PS. Probably there will be one already added, if you want to plot only one graph, you can for sure use and dont need to add a new one, just check on its name, it will be important to our code.

You can see that I have now two collection, so I will draw one graph in blue and the second one in red.

Since our application is built, let’s start coding.
Open up the click method of your button by double clicking and follow the code bellow.

private void button1_Click(object sender, EventArgs e)
{
    Random rdn = new Random();
    for (int i = 0; i < 50; i++)
    {
        chart1.Series["test1"].Points.AddXY
                        (rdn.Next(0,10), rdn.Next(0,10));
        chart1.Series["test2"].Points.AddXY
                        (rdn.Next(0,10), rdn.Next(0,10));
    }
                
    chart1.Series["test1"].ChartType = 
                        SeriesChartType.FastLine;
    chart1.Series["test1"].Color = Color.Red;

    chart1.Series["test2"].ChartType = 
                        SeriesChartType.FastLine;
    chart1.Series["test2"].Color = Color.Blue;           
    
}

As you could see, I just random a few numbers and added to my both series.

Below the for there are 4 lines of code where I set up how I’d like my graphs to be like. If you dont want a line graph, you can just change the enumerator SeriesChartType.

That’s the result. It’s a little bit weird cause of my coordinates, but I just wanted to show you how simple is that.

That’s it for now!

Pretty simple, huh?

If you prefer, you can find the whole application here.

Anything you’d like to add, please use the comment area below.

Thanks for the attention.