How to: Display Automatically Created Series in Separate Panes

• Jul 14, 2021
• 4 minutes to read

This example demonstrates how to display automatically created series in separate panes.

For this example to work correctly, do the following.

1. Start MS Visual Studio (2008 or 2010), and create a new Windows Forms Application, or open an existing one.
2. Include all necessary assemblies to the References list of your project.

3. Open the Solution Explorer window (e.g. by pressing CTRL+ALT+L), right-click the WindowsApplication1 item and in the invoked menu, point to Add and click Existing Item…. Then, locate the gsp.mdb file (it is shipped with XtraCharts suite and located in the directory, where you installed DevExpress demos) and click Add. In the displayed dialog, select the GSP table of this database.

   A dataset (named gspDataSet) is automatically created after performing the above steps.

4. Drop a button onto the form and add the following code to the Button1.Click event handler.

C#

using System;
using System.Drawing;
using System.Windows.Forms;
using DevExpress.XtraEditors;
using DevExpress.XtraCharts;
using gspDataSetTableAdapters;
// ...

private void button1_Click(object sender, EventArgs e) {
    // Create and customize a form.
    XtraForm form = new XtraForm();
    form.Text = "Multiple Panes and Chart Binding";
    form.Size = new Size(800, 600);

    // Create a chart.
    ChartControl chart = new ChartControl();

    // Handle the chart's BoundDataChanged event.
    chart.BoundDataChanged += new BoundDataChangedEventHandler(chart_BoundDataChanged);

    // Initialize a dataset. Initialize and fill data adapter.
    gspDataSet dataSet = new gspDataSet();
    GSPTableAdapter dataAdapter = new GSPTableAdapter();
    dataAdapter.Fill(dataSet.GSP);

    // Assign the chart's datasource to the created dataset.
    chart.DataSource = dataSet.GSP;
    // Define a data member for the chart's series.
    chart.SeriesDataMember = "Year";
    // Define an argument and value data members for the chart's series template,
    // so that the created series inherit these properties.
    chart.SeriesTemplate.ArgumentDataMember = "Region";
    chart.SeriesTemplate.ValueDataMembers[0] = "GSP";

    // Add the chart to the form's controls collection and fit the chart to the form's dimensions.
    chart.Dock = DockStyle.Fill;
    form.Controls.Add(chart);

    // Show the result.
    form.Show();
}

private void chart_BoundDataChanged(object sender, EventArgs e) {
    ChartControl chart = (ChartControl)sender;

    // Check whether the chart contains series.
    if(chart.Series.Count > 0) {
        // Obtain a diagram and clear its collection of panes.
        XYDiagram diagram = (XYDiagram)chart.Diagram;
        diagram.Panes.Clear();
        // Create a pane for each series.
        for(int i = 1; i < chart.Series.Count; i++) {
            XYDiagramPane pane = new XYDiagramPane("The Pane's Name");
            diagram.Panes.Add(pane);
            XYDiagramSeriesViewBase view = (XYDiagramSeriesViewBase)chart.Series[i].View;
            view.Pane = pane;
        }
    }
}

VB.NET

Imports System
Imports System.Drawing
Imports System.Windows.Forms
Imports DevExpress.XtraEditors
Imports DevExpress.XtraCharts
Imports gspDataSetTableAdapters
' ...

Private Sub button1_Click(ByVal sender As Object, ByVal e As EventArgs) _
Handles button1.Click
    ' Create and customize a form.
    Dim form As XtraForm = New XtraForm()
    form.Text = "Multiple Panes and Chart Binding"
    form.Size = New Size(800, 600)

    ' Create a chart.
    Dim chart As ChartControl = New ChartControl()

    ' Handle the chart's BoundDataChanged event.
    AddHandler chart.BoundDataChanged, AddressOf chart_BoundDataChanged

    ' Initialize a dataset. Initialize and fill data adapter.
    Dim dataSet As gspDataSet = New gspDataSet()
    Dim dataAdapter As GSPTableAdapter = New GSPTableAdapter()
    dataAdapter.Fill(dataSet.GSP)

    ' Assign the chart's datasource to the created dataset.
    chart.DataSource = dataSet.GSP

    ' Define a data member for the chart's series.
    chart.SeriesDataMember = "Year"

    ' Define an argument and value data members for the chart's series template,
    ' so that the created series inherit these properties.
    chart.SeriesTemplate.ArgumentDataMember = "Region"
    chart.SeriesTemplate.ValueDataMembers(0) = "GSP"

    ' Add the chart to the form's controls collection and fit the chart to the form's dimensions.
    chart.Dock = DockStyle.Fill
    form.Controls.Add(chart)

    ' Show the result.
    form.Show()
End Sub
Private Sub chart_BoundDataChanged(ByVal sender As Object, ByVal e As EventArgs)
    Dim chart As ChartControl = CType(sender, ChartControl)

    ' Check whether the chart contains series.
    If chart.Series.Count > 0 Then

        ' Obtain a diagram and clear its collection of panes.
        Dim diagram As XYDiagram = CType(chart.Diagram, XYDiagram)
        diagram.Panes.Clear()

        ' Create a pane for each series.
        Dim i As Integer = 1
        Do While i < chart.Series.Count
            Dim pane As XYDiagramPane = New XYDiagramPane("The Pane's Name")
            diagram.Panes.Add(pane)
            Dim view As XYDiagramSeriesViewBase = CType _
                (chart.Series(i).View, XYDiagramSeriesViewBase)
            view.Pane = pane
            i += 1
        Loop
    End If
End Sub

Tip

A complete sample project is available in the DevExpress Code Examples database at https://supportcenter.devexpress.com/ticket/details/e433/how-to-programmatically-display-automatically-created-series-in-separate-panes.