8/09/2018

How to use Winforms control Chart?


In this article, I'll tell you how to create a graph in the Winforms control Chart.
Our steps will be such:
  1. How to draw a linear graph?
  2. How to add a legend to the graph?
  3. How to scale the size of the graph (zoom)?

First you need to connect a library System.Windows.Forms.DataVisualization to work with Chart.








You also need to use namespace
using System.Windows.Forms.DataVisualization.Charting;

How to draw a linear graph?

chartTest.Dock = DockStyle.None;
            
chartTest.ChartAreas.Clear();
chartTest.Series.Clear();
chartTest.Legends.Clear();
chartTest.ChartAreas.Add("areaTest");
chartTest.ChartAreas["areaTest"].AxisX.MajorGrid.LineColor = Color.Black;
chartTest.ChartAreas["areaTest"].AxisX.MajorGrid.LineDashStyle = ChartDashStyle.Solid;  
chartTest.ChartAreas["areaTest"].AxisY.MajorGrid.LineColor = Color.Black;
chartTest.ChartAreas["areaTest"].AxisY.MajorGrid.LineDashStyle = ChartDashStyle.Solid;
chartTest.ChartAreas["areaTest"].BackColor = Color.White;

Color[] f_colour = new Color[] { Color.Green, Color.Red, Color.Blue, Color.Yellow, Color.YellowGreen, Color.HotPink };
int k = 0;

string f_nameSeries = "A1";
chartTest.Series.Add(f_nameSeries);
chartTest.Series[f_nameSeries].ChartArea = "areaTest";
chartTest.Series[f_nameSeries].Color = f_colour[k];
chartTest.Series[f_nameSeries].BorderWidth = 3;

for (int i = 0; i < 1000; i++)
{
    chartTest.Series[f_nameSeries].Points.AddXY(i, i);
}

How to add a legend to the graph?

chartTest.Series[f_nameSeries].ChartType = SeriesChartType.StepLine;
chartTest.Series[f_nameSeries].LegendText = "LegendText";
chartTest.Legends.Add(f_nameSeries);
chartTest.Legends[f_nameSeries].BorderColor = f_colour[k]; 

How to scale the size of the graph (zoom)?

Here we have 2 steps.

1. To create handler and allow series selection.

chartTest.MouseDown += new MouseEventHandler(clikOnGraf);

chartTest.ChartAreas["areaTest"].CursorX.IsUserSelectionEnabled = true;
chartTest.ChartAreas["areaTest"].CursorY.IsUserSelectionEnabled = true;

2. Write function that will reset zoom settings.

private void clikOnGraf(object sender, MouseEventArgs e)
{
    if (e.Button == System.Windows.Forms.MouseButtons.Right)
    {
        Chart f_ch = (Chart)sender;
        f_ch.ChartAreas["areaTest"].AxisX.ScaleView.ZoomReset();
        f_ch.ChartAreas["areaTest"].AxisY.ScaleView.ZoomReset();
    }
}

All program code:
private void Form1_Load(object sender, EventArgs e)
{
    chartTest.Dock = DockStyle.None;

    chartTest.ChartAreas.Clear();
    chartTest.Series.Clear();
    chartTest.Legends.Clear();
    chartTest.ChartAreas.Add("areaTest");
    chartTest.ChartAreas["areaTest"].AxisX.MajorGrid.LineColor = Color.Black;
    chartTest.ChartAreas["areaTest"].AxisX.MajorGrid.LineDashStyle = ChartDashStyle.Solid;
    chartTest.ChartAreas["areaTest"].AxisY.MajorGrid.LineColor = Color.Black;
    chartTest.ChartAreas["areaTest"].AxisY.MajorGrid.LineDashStyle = ChartDashStyle.Solid;
    chartTest.ChartAreas["areaTest"].BackColor = Color.White;

    Color[] f_colour = new Color[] { Color.Green, Color.Red, Color.Blue, Color.YellowGreen, Color.HotPink };
    int k = 0;

    string f_nameSeries = "A1";
    chartTest.Series.Add(f_nameSeries);
    chartTest.Series[f_nameSeries].ChartArea = "areaTest";
    chartTest.Series[f_nameSeries].Color = f_colour[k];
    chartTest.Series[f_nameSeries].BorderWidth = 3;

    for (int i = 0; i < 1000; i++)
    {
        chartTest.Series[f_nameSeries].Points.AddXY(i, i);
    }

    chartTest.Series[f_nameSeries].ChartType = SeriesChartType.StepLine;
    chartTest.Series[f_nameSeries].LegendText = "LegendText";
    chartTest.Legends.Add(f_nameSeries);
    chartTest.Legends[f_nameSeries].BorderColor = f_colour[k];

    chartTest.MouseDown += new MouseEventHandler(clikOnGraf);

    chartTest.ChartAreas["areaTest"].CursorX.IsUserSelectionEnabled = true;
    chartTest.ChartAreas["areaTest"].CursorY.IsUserSelectionEnabled = true;
}

private void clikOnGraf(object sender, MouseEventArgs e)
{
    if (e.Button == System.Windows.Forms.MouseButtons.Right)
    {
        Chart f_ch = (Chart)sender;
        f_ch.ChartAreas["areaTest"].AxisX.ScaleView.ZoomReset();
        f_ch.ChartAreas["areaTest"].AxisY.ScaleView.ZoomReset();
    }
}


No comments:

Post a Comment