WebChartControl.Series Property
Provides access to the chart control’s collection of series objects.
Namespace: DevExpress.XtraCharts.Web
Assembly: DevExpress.XtraCharts.v20.2.Web.dll
NuGet Package: DevExpress.Web.Visualization
Declaration
Property Value
| Type | Description |
|---|---|
| SeriesCollection | A SeriesCollection object that represents the collection of all series. |
Remarks
The Series property provides access to a collection of all series which are defined explicitly within a chart control (either at design time or runtime). The collection is represented by an instance of the SeriesCollection class, and allows individual series (which are instances of the Series class) to be added, deleted and accessed using indexer notation.
Note that series which are bound to data at the level of a web chart control (in particular, using the ASPxDataWebControlBase.DataSource, WebChartControl.SeriesDataMember and both the SeriesBase.ArgumentDataMember and SeriesBase.ValueDataMembers properties) are created dynamically, based upon the data obtained from the specified data source and they are not presented within the Series collection. In order to access such series, use the web chart control’s specific events (such as the WebChartControl.BoundDataChanged event, for instance). To perform a centralized customization of such series, use the settings which are available via the WebChartControl.SeriesTemplate property.
Example
This example shows how to add a web chart control to a web page, create a series and bind it to a data source.
- Create an ASP.NET Web Application (Visual studio 2012, 2013, 2015, 2017 or 2019), or open an existing one.
Open the form’s .aspx.cs file. In the Page.Load event handler, create a new WebChartControl class instance and add it to the form’s Controls collection.
Add the required assemblies and register them in the Web.config file. For more details, refer to the following help topic: Adding a Web Chart.
You can also drop a WebChartControl from the toolbox onto the form to add the control at design time. In this case, the required assemblies are automatically added. Refer to the following help topic for details: How to: Add a Chart to a Web Application.
- Then, create a new series and add it to the chart.
- Specify the Series.DataSource property to assign a data source to the series.
- Define the SeriesBase.ArgumentDataMember and SeriesBase.ValueDataMembers properties to specify data source columns that contain point arguments and values.
using System;
using System.Data;
using DevExpress.XtraCharts;
using DevExpress.XtraCharts.Web;
// ...
namespace WebChartRuntime {
public partial class _Default : System.Web.UI.Page {
protected void Page_Load(object sender, EventArgs e) {
// Create a chart.
WebChartControl WebChartControl = new WebChartControl();
// Add the chart to the form.
// Note that a chart isn't initialized until it's added to the form's collection of controls.
this.form1.Controls.Add(WebChartControl);
// Create a new bar series.
Series series = new Series("2017", ViewType.Bar);
// Add the series to the chart.
WebChartControl.Series.Add(series);
// Specify the series data source.
DataTable seriesData = GetData();
series.DataSource = seriesData;
// Specify an argument data member.
series.ArgumentDataMember = "Region";
// Specify a value data member.
series.ValueDataMembers.AddRange(new string[] { "Sales" });
// Rotate the diagram (if necessary).
((XYDiagram)WebChartControl.Diagram).Rotated = true;
}
public DataTable GetData() {
DataTable table = new DataTable();
table.Columns.AddRange(new DataColumn[] {
new DataColumn("Region", typeof(string)),
new DataColumn("Sales", typeof(decimal))
});
table.Rows.Add("Asia", 5.289M);
table.Rows.Add("North America", 4.182M);
table.Rows.Add("Europe", 3.725M);
table.Rows.Add("Australia", 2.272M);
table.Rows.Add("South America", 2.117M);
return table;
}
}
}
Related GitHub Examples
The following code snippets (auto-collected from DevExpress Examples) contain references to the Series property.
Note
The algorithm used to collect these code examples remains a work in progress. Accordingly, the links and snippets below may produce inaccurate results. If you encounter an issue with code examples below, please use the feedback form on this page to report the issue.