Data Binding Microsoft Chart Control


When you add a new visualization in your application, the very first thing you do, is bind it to the data. Microsoft Chart control allows many different ways of populating data in the chart and it is important to understand the differences between them and being able to choose the best approach. I put together all the possible data binding options and the scenarios when they should be used.

Data Sources

Before jumping into the binding methods I want to quickly list all the supportable data sources which can be used in chart binding methods. Keep in mind that not all methods accept all source types.

  • SqlCommand
  • OleDbCommand
  • SqlDataAdapter
  • OleDbDataAdapter
  • DataView
  • DataSet
  • DataReader
  • List
  • Array
  • IList
  • IListSource
  • IEnumerable

Data Point X and Y values

When you bind chart you create series and series data points. Each data point in the series should have it's Y value set and in addition to the Y value you can also bind or set other data point properties:

  • X Value - Defines location of the data point along X axis. If not specified, data point index in the series will be used.
  • Additional Y Values - Chart types like Bubble or Stock require multiple Y values. You can also bind additional Y values in the regular chart types, if you want to use those values for labels or tooltips.
  • Category - When you displaying categories on the X axis, they are stored in the AxisLabel property of the data point. All data binding methods will automatically detect the type of the data and you should not worry about it.
  • Other Properties - Some of the binding methods allow you to set additional properties like data point labels, tooltips and others.

Binding Options Overview

This table lists data binding techniques, starting from the most basic methods proceeding to more advanced.


  • Simple binding for X and Y values.
  • Automatic series creation, based on the number of columns in the data source.
  • No multiple Y values per series.
  • All series have same X value, or it is not set.
  • No binding for extended chart properties like tooltips.

Chart.DataSource and Chart.DataBind

  • Can be used at design-time.
  • Supports multiple Y values.
  • No binding for extended chart properties like tooltips.


  • Supports multiple data sources, including separate data source for X and Y values.
  • Supports multiple Y values.
  • Provides more flexibility than methods above
  • No binding for extended chart properties like tooltips.


  • Same as the above, plus:
  • Supports binding for extended chart properties like tooltips.
  • Does not support different data sources for X and Y values of a series.


  • Automatically creates series for each unique value in specified column used to group the data.
  • Only single level grouping is supported.

Binding Options Details

Chart.DataBindTable method

The Chart.DataBindTable method is the simplest way to bind chart to a table with several columns. New series will be automatically created for each of the columns and you can optionally use one column for the X value for all series.


Imagine you have a data source containing these columns: Prod A, Prod B, Prod C, Prod D, Prod E, Other and SalesName, you can easily create chart below with a single line of code:

Chart1.DataBindTable(myReader, "SalesName");



Chart.DataSource property

Chart DataSource property is the only way to bind chart at design-time. In addition to specifying the DataSource property you also need to create series and set their YValueMembers and optionally XValueMember properties. Multiple Y values can be bound if you specify comma separated list of members in the YValueMembers property.

Chart will automatically bind itself to specified data source and members just before rendering. You can force chart to bind at any moment by calling Chart.DataBind() method.

// Set chart data source
chart1.DataSource = myCommand;
// Set series members names for the X and Y values
chart1.Series["Series 1"].XValueMember = "Name";
chart1.Series["Series 1"].YValueMembers = "Sales";
// Data bind to the selected data source



The Chart.DataBindCrossTab is different compared to all other binding methods, in that it allows for the grouping of unique values in a column. Each unique value in the specified grouped column results in the creation of a data series. In addition, extended data point properties other than X and Y values can be bound.

These other properties are bound using the otherFields parameter using this syntax:

PointProperty=Field[{Format}] [,PointProperty= Field[{Format}]].

A list of these properties are as follows: AxisLabel, Tooltip, LabelLegendTextLegendTooltip and CustomPropertyName (the name of a custom property). For more information on possible formats see the Formatting Types topic in the MSDN library.


In the sample below we have a table that has the sales and commissions of sales people for three years. We group by the "Name" column, thereby creating one data series per sales person. The X values are bound to the "Year" column, the Y values are bound to the "Sales" column, the Label property of the resulting data points (one per record) is bound to the "Commissions" column, and the LegendText property is bound to the "Name" column. 



// Group by "Name" column, bind X values to "Year", Y values to "Sales",
// and Label property to "Commissions.
chart1.DataBindCrossTab(myReader, "Name", "Year", "Sales", "Label=Commissions");



This method allows for data point properties other than X and Y values to be bound to data columns. For example, you want to set data point label to a value in one of the data source columns. These other properties are bound using the otherFields parameter using this syntax:

PointProperty=FieldName[{Format}][,PointProperty= FieldName[{Format}]]

A list of these properties includes: AxisLabel, Tooltip, LabelLegendTextLegendTooltip and CustomPropertyName (the name of a custom property).

This method does not allow you to specify separate data sources for the X and Y values of a series (for this functionality use the DataBind(X)Y methods described in the section above).


Code below demonstrates how to bind X and Y values of the series to columns "Name" and "Sales" respectively. The Label and Tooltip properties of the resulting data points are also bound to the "Commissions" and "Year" column.

myReader, "Name", "Sales", "Tooltip=Year, Label=Commissions{C2}");



The DataBindXY method allows for the binding of X and Y values of a series, while DataBindY binds Y values only. When binding X and Y values using DataBindXY the same or different data sources may be used.

Some data sources support multiple values (e.g. data sources that have columns of data). For example, OleDbDataReader may have access to more than one column of data. If the column to be used is not specified, then the first available column will be used. To use a column other than the first one just specify the column name in the method call.

Note that when specifying the column names to be bound to the Y values a comma can be embedded as part of a column name by specifying a double comma.


Code below demonstrates how to bind series points to the array of doubles.

// Initialize an array of doubles.
double [] array = { 2.8, 4.4, 6.5, 8.3, 3.6, 5.6, 7.3, 9.2, 1.0};
// Bind the double array to the Y axis points of the data series.

'Manual' series population

In case you need to perform some custom actions while binding and none of the above methods works, you can always 'manually' bind chart by iterating through the data source and add data points to the series as needed. This approach is also very useful when series data is calculated using some formula.


// Resolve the address to the Access database
string fileNameString = this.MapPath(".");
fileNameString += "..\\..\\..\\data\\chartdata.mdb";
// Initialize a connection string
string myConnectionString = "PROVIDER=Microsoft.Jet.OLEDB.4.0;Data Source=" + fileNameString;
// Define the database query
string mySelectQuery="SELECT * FROM SALESCOUNTS;";
// Create a database connection object using the connection string
OleDbConnection myConnection = new OleDbConnection(myConnectionString);
// Create a database command on the connection using query
OleDbCommand myCommand = new OleDbCommand(mySelectQuery, myConnection);
// Open the connection
// Initializes a new instance of the OleDbDataAdapter class
OleDbDataAdapter myDataAdapter = new OleDbDataAdapter();
myDataAdapter.SelectCommand = myCommand;
// Initializes a new instance of the DataSet class
DataSet myDataSet = new DataSet();
// Adds rows in the DataSet
myDataAdapter.Fill(myDataSet, "Query");
foreach(DataRow row in myDataSet.Tables["Query"].Rows)
   // For each Row add a new series
   string seriesName = row["SalesRep"].ToString();
   Chart1.Series[seriesName].ChartType = SeriesChartType.Line;
   Chart1.Series[seriesName].BorderWidth = 2;
   for(int colIndex = 1; colIndex < myDataSet.Tables["Query"].Columns.Count; colIndex++)
      // For each column (column 1 and onward) add the value as a point
      string columnName = myDataSet.Tables["Query"].Columns[colIndex].ColumnName;
      int YVal = (int) row[columnName];
      Chart1.Series[seriesName].Points.AddXY(columnName, YVal);
DataGrid.DataSource = myDataSet;
// Closes the connection to the data source. This is the preferred
// method of closing any open connection.

Other useful things to know

Here are couple things that you should know about when binding chart:

  • Empty Points - Understand what empty points are and how you can use them. Right now the best source of the information is Chart Sample Environment but I will blog about it later.
  • AlignDataPointsByAxisLabel - If you are using a stacked chart type with categorical X axis this helper method can be very useful. Find more information in the documentation and Chart Sample Environment.
Comments (33)
  1. templeton7 says:


    I’m trying to bind to nearly identical data source in your DataBindTable example but a "Specified method is not supported" exception is thrown.  I’m using an oracle data reader and the query returns 1 text column (my "x") and 4 numeric columns.

    Any ideas why I’m getting this error?  Thanks.

  2. Alex Gorev says:

    This maybe caused by the Reset() method we call internally in DataBindTable. Please make sure that data source you are using supports resetting.


  3. jmora says:

    I have:

    ‘datasource from a linq

    chart.DataBindCrossTable(query.ToList(), "Users", "Month", "Tries", "")

    ‘set the chart type to stacked column

    For Each serie As Series In chart.Series

                   serie.ChartType = SeriesChartType.StackedColumn


    It works fine, but…

    here an example of data (Month,Users,Tries)






    the first column its ok but WHEN the chart build the last serie(User4) the second column have a EMPTY SPACE between the first serie and the last.

    Try it!

    It happends with other chart type like normal bars. TNKS

  4. jmora says:


    this line solve the problem, (I don´t know why)

    chart.DataManipulator.InsertEmptyPoints(1, IntervalType.Number, seriesNames)

    where seriesNames is a string with the series names separate by commas "User1,User2,…"

    For more information see:


    Jaime Mora

  5. jbarsotti says:

    So what if people are manipulating the data in other areas of the form.

    Normally after a datachange you just call refresh on the form and all databound information gets updated.

    When I do this the chart stays stale and doesn’t update till I call an explicit DataBind to rebind the data.

    Am I missing something?

  6. Alex Gorev says:

    Binding and re-painting the chart can be a time consuming operation and chart does not automatically update itself on every data source change. You will need to re-bind the chart as nessesary when the data source is changed.


  7. losonc says:

    Hi Alex,

    Thanks for the excellent tutorials on MS Chart Control.

    I am having problems with retrieving the index of a specific datapoint in a dataSeries on the chart. This supposed to be trivial because it is essential for many tasks.

    For example I can find the first datapoint visible in a ScaleView and would need to find out its index. However, such property does not exist for the datapoint… Or am I missing something?

    Thanks for help,



  8. Tushar Dave says:

    I am using Microsoft charts controls for windows application version 3.5. I am having problem displaying tooltip on the X and Yaxis line. I have set the tooltip property and when i do mouse over on the series line, it does display the tooltip as expected. Only when the series crosses the X and Y axis line, it does not display the tooltip. Can somone please help me on this?

  9. jwavila says:


    I refer to this page frequently and noticed the layout/formatting of the page has recently changed. Some of the text, for example in the Binding Options Overview, is cut off on the right side.

  10. Kushal says:

    Thank for the tutorial..I have one problem

    My scenario is to bind multiple datatables to a same line chart which will display one line for one datatable on the chart..

    Please help

  11. Djay says:


    I am not able to view the points on grah area. Is there anything to set to view the plotted points.

  12. John says:

    is there a way to refresh the chart after an update was executed on the data? example from 100 rows to 10 rows?

    hope u can help me on this one ?

  13. is there a way to refresh the chart after an update was executed on the data? example from 100 rows to 10 rows?

    hope u can help me on this one ?

  14. Hany Shebl says:


    the way to refresh the chart..

    keep the existing points which drown in the serious in a collection like a datatable  then add the new points to this datatable then draw the all points.

  15. Fahim Shaikh says:


    I'm facing issue with Series of Pie chart. Pie chart is not slicing based on data. its loading the data properly in label but not showing slice ie.. my pie chart would be having 2 slice (Exceptions & Non-review) based on there figures value raiot will change.

    Here is Data from

    Legend            Figures

    Exceptions 144351

    Non-review 747440670

    <asp:Chart ID="PieChartWIPException" runat="server" PaletteCustomColors="IndianRed; CornflowerBlue"

                               Palette="None" BackColor="WhiteSmoke" Height="280px" Width="450px" BorderlineDashStyle="Solid"

                               BackSecondaryColor="White" BackGradientStyle="TopBottom" BorderWidth="2" ImageLocation="~/Images/ChartPic_#SEQ(300,3)"

                               ImageStorageMode="UseImageLocation" ImageType="Jpeg">


                                   <asp:Legend BackColor="Transparent" Alignment="Center" Docking="Bottom" Font="Trebuchet MS, 8.25pt, style=Bold"

                                       IsTextAutoFit="True" Name="Default" LegendStyle="Row">



                               <BorderSkin SkinStyle="Emboss"></BorderSkin>


                                   <asp:Series IsValueShownAsLabel="true" Name="PieSeriesWIPException" ChartType="Pie">




                                   <asp:ChartArea Name="PieCharAreaWIPException" BorderColor="64, 64, 64, 64" BackSecondaryColor="Transparent"

                                       BackColor="Transparent" ShadowColor="Transparent" BorderWidth="0">

                                       <Area3DStyle Inclination="68" Enable3D="true" LightStyle="Realistic" />                                    




    Code behide

    PieChartWIPException.Series["PieSeriesWIPException"].Points.DataBind(WipSummaries.WIPSummaryLegends.AsEnumerable(), "Legend", "Figures", "LabelFormat=Figures{C}");

  16. Bahram says:

    Hi Alex,

    I am using VB.NET to draw a chart. My data source is a Grid. and I use two fields to StartTime and Description

    Description consists of five or six unique strings :  H-N Sag,Outage,N-GSurge,1 N-G Impulse, Sync …

    I want to draw a bar chart based on the number of each desc in Time (X axis) .

    I am using this code but there is no result, only the legends are showed.

    C.DataBindCrossTable(DataGridView1.DataSource, "Description", "StartTime", "Description", String.Empty)

    My question is :

    1-How dynamic series can be shown from a two column data set.

    2-In Y-fields , when I type comma separeted fields (values) it gets an error that there is no such flelds ( it is true)

    Thank you

  17. Bill says:

    Hi Alex,

    I have placed a chart on a VB.Net form, and repopulate the Table to which the chart is bound, on a combo box selection (an item number).  My chart works perfectly the first time, but on the second selection, I get:

    A chart element with the name 'MonthlySales' already exists in the series collection.

    How do I reset the chart control to accept new data, same select, just different item number.

    Thank you in advance.

  18. Boroo says:

    Hi Alex,

    Thanks for the great article. A quick question. I have a very similar chart with multiple line series using DataBindCrossTable method. How do I draw the series starting from their very first X value not 0? I've tried setting axisX.Minimum to very frst X value for each series, but no luck.


  19. Boroo says:

    Hi Alex,

    I have a chart with multiple series using DataBindCrossTable method, exactly like yours in this tutorials. How do I set the origin of the chart to be very first X value of the series? I've tried using axisX.Minimum but no luck.


  20. Rick Svitak says:

    Outstanding, I just wish I would have found it yesterday. Would have saved me a lot of trouble.

  21. Life Element, Inc. says:

    Make sure your data is sorted properly before rendering the graph.  This is important when pulling data from multiple data stores into a single view.  If left unsorted, methods like Chart.DataBindTable can produce anomalies, particularly with line graphs of multiple series.  To avoid strange lines or figures in your charts, sort the data before rendering.

  22. Archana says:

    Hi Alex/Boroo,

    I have 2 problems. First one is what Boroo asked. And second one is I am using DataBindCross tab. in stacked area graph. But it is not displaying legends for each series. And as we specify legends for series I don't know how to assign it to a column name in datatable.

    Please help.


  23. Archana says:

    Got it;


    Chart1.ChartAreas(0).AxisX.IsMarginVisible = False



  24. Is not possible to use two different DATASET in a same chart ? says:

    I'd appreciate your help so very much.

    I'm sorry but I have error in this code.

    Can you help me?

    private void Page_Load(object sender, System.EventArgs e)


          OdbcConnection myConnectionString = new OdbcConnection(ConfigurationManager.ConnectionStrings["ConnMySQL"].ConnectionString);


          Chart1.ChartAreas["ChartArea1"].Area3DStyle.Inclination = 30;

          Chart1.ChartAreas["ChartArea1"].Area3DStyle.Enable3D = false;

          this.Chart1.SaveImage(GraficoPNG, ChartImageFormat.Png);

          Chart1.Series["Default"].ChartType = SeriesChartType.Column;

          Chart1.Series["Default"]["PointWidth"] = "0.3";

          Chart1.Series["Default"].IsValueShownAsLabel = true;

          Chart1.Series["Default"]["BarLabelStyle"] = "Center";

          Chart1.Series["Default"]["PixelPointDepth"] = "20";

          Chart1.Series["Default"]["DrawingStyle"] = "Cylinder";

          Chart1.Series["Default2"].ChartType = SeriesChartType.Column;

          Chart1.Series["Default2"]["PointWidth"] = "0.3";

          Chart1.Series["Default2"].IsValueShownAsLabel = true;

          Chart1.Series["Default2"]["BarLabelStyle"] = "Center";

          Chart1.Series["Default2"]["PixelPointDepth"] = "20";

          Chart1.Series["Default2"]["DrawingStyle"] = "Cylinder";

          Chart1.Series["Default2"].Points.DataBind(myConnectionString, "x_value", "y_value", "Tooltip=x_value, Label=y_value{C2}");




           <asp:Chart ID="Chart1" runat="server" DataSourceID="SqlDataSource1" Width="400px">


                 <asp:Series Name="Default" XValueMember="zDesc" YValueMembers="t0">




                 <asp:Series Name="Default2" XValueMember="x_value" YValueMembers="y_value">




                   <asp:ChartArea Name="ChartArea1">




           <asp:SqlDataSource ID="SqlDataSource1" runat="server"

            ConnectionString="<%$ ConnectionStrings:ConnMySQL %>"

            ProviderName="<%$ ConnectionStrings:ConnMySQL.ProviderName %>"

            SelectCommand="SELECT * from first_table; ">


           <asp:SqlDataSource ID="SqlDataSource2" runat="server"

            ConnectionString="<%$ ConnectionStrings:ConnMySQL %>"

            ProviderName="<%$ ConnectionStrings:ConnMySQL.ProviderName %>"

            SelectCommand="SELECT * from second_table ;">


    Server Error in '/' Application.

    Compilation Error

    Description: An error occurred during the compilation of a resource required to service this request. Please review the following specific error details and modify your source code appropriately.

    Compiler Error Message: CS1502: The best overloaded method match for 'System.Web.UI.DataVisualization.Charting.DataPointCollection.DataBind(System.Collections.IEnumerable, string, string, string)' has some invalid arguments

  25. Goutam Behera says:

    Can i use microsoft charts to show organisational structure….can someone elaborate

  26. SenChen says:

    I am new to MS Chart Control. I am binding datatable with the chart control. but when the number of rows more then 4000, the chart takes to long to render. I have a datatable with 20,000 rows and chart falis to render. Is there any thing i am doing wrong

               ControlChart.DataSource = table

               ControlChart.Series("Series1").XValueMember = "Coulmn1"

               ControlChart.Series(("Series1").YValueMembers ="Coulmn2"


  27. NIket says:

    How can i assign datasource  to graph .. i want make a graph with grouping details

  28. ms chart control assign more than one column to x-axis says:

    Here is my data

    SalesPerson Jan-2008 Feb-2008 Mar-2008 Apr-2008 Mat-2008

    Joe 1                100             200           99               10             250

    Mary M               50              250           90               50             200

    Now I want want year and month in x-axis and corresponding value in y-axis. grouping by sales person.

  29. raju says:

    Joe 1                100             200           99               10             250

    Mary M               50              250           90               50             200

  30. Supox says:

    Badly written – difficult to understand.

    eg: For the Chart.DataSource example, do you still need to call DataBindTable() or not?

  31. YCS says:

    Hola, como puedo dejar el plot area como rojo, amarillo, verde

  32. Kelboy says:

    Sir can u please make a code for Manual Series Population in because i am getting error on the Datarow part.. thank you

  33. Andrew says:

    Hi there,

    What should i do to change the font family and font size of those three labels "Andrew", "David" and "Bryan" ?


Comments are closed.

Skip to main content