How to: Bind a Web Chart to Data (Runtime Sample)

  • 3 min to read

This example demonstrates how to bind a web chart to data using series templates. For specific information on working with the ASP.NET Chart Control, refer to Concepts.

To accomplish this task, create a new ASP.NET Web Application, add a WebChartControl, and add a data source to it (these steps are similar to steps 1-8 of the Lesson 4 - Use the Series Template for Auto-Created Series tutorial).

Next, add a button to your application, and handle its Click event as follows.

NOTE

For the WebChartControl to be properly bound to its data source, and to create series points, call the ASPxWebControl.DataBind method after customizing the chart's properties. When resolving the data source, the data source identified by the ASPxDataWebControlBase.DataSourceID property takes precedence. If the ASPxDataWebControlBase.DataSourceID is not set, the object identified by the ASPxDataWebControlBase.DataSource property is used.

using System;
using DevExpress.XtraCharts;
// ...

namespace WebChartDataBinding {
    public partial class _Default : System.Web.UI.Page {

        protected void Button1_Click(object sender, EventArgs e) {
            WebChartControl1.DataSourceID = "AccessDataSource1";
            WebChartControl1.SeriesDataMember = "Year";
            WebChartControl1.SeriesTemplate.ArgumentDataMember = "Region";
            WebChartControl1.SeriesTemplate.ValueDataMembers.AddRange(new string[] {"GSP"});
            WebChartControl1.SeriesTemplate.View = new SideBySideBarSeriesView();
            WebChartControl1.DataBind();
        }
    }

}
See Also