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.