We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Display datagridview data in syncfusion chart

Thread ID:





120553 Sep 24,2015 10:36 PM UTC Sep 29,2015 07:34 AM UTC WinForms 5
Tags: Chart
Kevin Shay
Asked On September 24, 2015 10:36 PM UTC

I'm trying to plot data into a chart from specific columns in datagridview. These are plotted against the date. The windows chart syntax seems quite different than syncfusion.  Below is the example that works with windows chart. There is no .DataSource extension in the syncfusion code, only DataSourceName. Also there is no .Rows or .Columns extension either.

private void Eccentricity_btn_Click(object sender, EventArgs e)
            if (CK_QA_DataDataGridView.Rows.Count == 0)
                MessageBox.Show("Select Date Range and Show Results Before Graphing");
                chart1.Visible = true;
                InitialChart.Visible = false;

                chart1.DataSource = CK_QA_DataDataGridView.DataSource;
                //Tube A Beam Eccentricity Series
                this.chart1.Series["Tube A - Beam"].XValueMember = CK_QA_DataDataGridView.Columns[0].DataPropertyName;

                this.chart1.Series["Tube A - Beam"].YValueMembers = CK_QA_DataDataGridView.Columns[3].DataPropertyName;
                //Tube B Beam Eccentricity Series
                this.chart1.Series["Tube B - Beam"].XValueMember = CK_QA_DataDataGridView.Columns[0].DataPropertyName;

                this.chart1.Series["Tube B - Beam"].YValueMembers = CK_QA_DataDataGridView.Columns[7].DataPropertyName;
                //Tube A Shadow Eccentricity Series
                this.chart1.Series["Tube A - Shadow"].XValueMember = CK_QA_DataDataGridView.Columns[0].DataPropertyName;

                this.chart1.Series["Tube A - Shadow"].YValueMembers = CK_QA_DataDataGridView.Columns[4].DataPropertyName;
                //Tube B Shadow Eccentricity Series
                this.chart1.Series["Tube B - Shadow"].XValueMember = CK_QA_DataDataGridView.Columns[0].DataPropertyName;

                this.chart1.Series["Tube B - Shadow"].YValueMembers = CK_QA_DataDataGridView.Columns[8].DataPropertyName;


Deepaa Pragaasam [Syncfusion]
Replied On September 25, 2015 12:54 PM UTC

Hi Kevin,
Thanks for contacting Syncfusion Support.
We have analyised your query .It is possible to bind the dataViewGrid to the chart by using the
ChartDataBindModel Property.

Please refer the following help document link for further reference

We have created a sample where the datatable is bind to the DataViewGrid and assigned to the chart.
I am attaching the code snippet for your reference
Code Snippet:

           ChartDataBindModel model = null;

            model = new ChartDataBindModel(table);

            model.XName = "Year";

            // The columns that contain the Y values.

            model.YNames = new string[] { "Population" };
            series1.SeriesModel = model;

Screenshot :
We have binded the datatable “People ” containing the values in the dataViewGrid.I have attached the below screenshot which is rendered using the datatable

I have attached the sample for your reference
Please let us know if you have any concerns.

Sakthi G [Syncfusion]
Replied On September 28, 2015 04:46 AM UTC

From: Kevin Shay
Sent: Saturday, September 26, 2015 6:37 PM
To: Syncfusion Support <support@syncfusion.com>
Subject: Re: Syncfusion support community forum 120553, Display datagridview data in syncfusion chart, has been updated.


Thanks so much for your response! It's really helpful. I'm facing a problem when I call the chart with a button. Since the code you have says "chart.Series.Add(series1);", every time I click the button to update the chart it adds a series on top of the one I just added. It's essentially the same data being added multiple times. Is there an "update" function rather that "add"?

Kevin Shay

Deepaa Pragaasam [Syncfusion]
Replied On September 28, 2015 12:52 PM UTC

Hi Kevin,
Thanks for the revert.
We have analyised your query and created the sample according to your requirement.
On button click the datasource is bound to the exsisting series, without using the Add Method.

         model1 = new ChartDataBindModel(table);


         model1.XName = "Year";


         model1.YNames = new string[] { "Population" };


         this.chart.Series[0].SeriesModel = model1;


Rendered  empty chart in datagrid view

On button click, the below chart is displayed

I have attached the sample for your reference
Please let us know if you have any concerns.

Kevin Shay
Replied On September 28, 2015 09:08 PM UTC


You are making a table and telling the datagridview to pull values from that table. I need to pull values from the datagridviewer due to a date range filter that has already been applied. In other words, I need to pull data into the chart from the dataGridView1.DataSource "directly". Something like chartControl1.Datasource = dataGridView1.DataSource. To pull the data from the table would be unfiltered and not useful. Is there anyway to do this?


Deepaa Pragaasam [Syncfusion]
Replied On September 29, 2015 07:34 AM UTC

Hi Kevin,
Thanks for the revert.
We have analyised your query and created a sample where the DataGridView datasource is bound directly to the chart on button click.
Code Snippet:
I have created the ChartDataBindModel and assigned the dataGridView datasource to it.

ChartDataBindModel model1 = null;

           model1 = new ChartDataBindModel(this.dataGridView1.DataSource);

  this.chart.Series[0].SeriesModel = model1;

Default gridview with datatable

On button Click

We have attached the sample for your reference
Please let us know if you have any concerns.


This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon