How to: Visualize Data from the DXPivotGrid Control using the DXCharts Suite

• Jun 07, 2019
• 2 minutes to read

This example shows how to visualize data displayed by the DXPivotGrid using the DXCharts Suite.

MainWindow.xaml

<Window x:Class="HowToBindToMDB.MainWindow" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:dxe="http://schemas.devexpress.com/winfx/2008/xaml/editors"
    xmlns:dxc="http://schemas.devexpress.com/winfx/2008/xaml/charts"
    xmlns:dxpg="http://schemas.devexpress.com/winfx/2008/xaml/pivotgrid" 
    Title="MainWindow" Height="633" Width="720" Loaded="Window_Loaded">
    <Grid Margin="10">
        <Grid.RowDefinitions>
            <RowDefinition Height="*" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <dxpg:PivotGridControl Name="pivotGridControl1" Grid.Row="0"
                               HorizontalAlignment="Left" VerticalAlignment="Top" 
                               DataSource="{Binding}" ChartProvideDataByColumns="True"  >
            <dxpg:PivotGridControl.Fields>
                <dxpg:PivotGridField Name="fieldCustomer" FieldName="Sales Person" 
                                     Area="FilterArea" Caption="Customer" Visible="False" />
                <dxpg:PivotGridField Name="fieldYear" FieldName="OrderDate" 
                                     Area="ColumnArea" Caption="Year" GroupInterval="DateYear" />
                <dxpg:PivotGridField Name="fieldCategoryName" FieldName="CategoryName" 
                                     Area="RowArea" Caption="Product Category" />
                <dxpg:PivotGridField Name="fieldProductName" FieldName="ProductName" 
                                     Area="RowArea" Caption="Product Name" />
                <dxpg:PivotGridField Name="fieldExtendedPrice" FieldName="Extended Price" 
                                     Area="DataArea" Caption="Extended Price" CellFormat="c0" />
            </dxpg:PivotGridControl.Fields>
        </dxpg:PivotGridControl>
        <dxc:ChartControl Name="chart" Grid.Row="1" 
                          DataSource="{Binding ElementName=pivotGridControl1, Path=ChartDataSource}">
            <dxc:ChartControl.Diagram>
                <dxc:XYDiagram2D SeriesDataMember="Series">
                    <dxc:XYDiagram2D.SeriesTemplate>
                        <dxc:BarSideBySideSeries2D ArgumentDataMember="Arguments" ValueDataMember="Values">
                            <dxc:BarSideBySideSeries2D.PointOptions>
                                <dxc:PointOptions PointView="Values">
                                    <dxc:PointOptions.ValueNumericOptions>
                                        <dxc:NumericOptions Format="Currency" Precision="0" />
                                    </dxc:PointOptions.ValueNumericOptions>
                                </dxc:PointOptions>
                            </dxc:BarSideBySideSeries2D.PointOptions>
                        </dxc:BarSideBySideSeries2D>
                    </dxc:XYDiagram2D.SeriesTemplate>
                </dxc:XYDiagram2D>
            </dxc:ChartControl.Diagram>
            <dxc:ChartControl.Legend>
                <dxc:Legend ReverseItems="True" />
            </dxc:ChartControl.Legend>
        </dxc:ChartControl>
        </Grid>
</Window>

MainWindow.xaml.cs

using System.Data;
using System.Data.OleDb;
using System.Windows;
using DevExpress.Xpf.PivotGrid;
using HowToBindToMDB.NwindDataSetTableAdapters;
using DevExpress.XtraPivotGrid;

namespace HowToBindToMDB {
    public partial class MainWindow : Window {
        NwindDataSet.SalesPersonDataTable salesPersonDataTable = 
            new NwindDataSet.SalesPersonDataTable();

        SalesPersonTableAdapter salesPersonDataAdapter = 
            new SalesPersonTableAdapter();

        int minSum = 500;

        public MainWindow() {
            InitializeComponent();
            pivotGridControl1.DataSource = salesPersonDataTable;
        }

        private void Window_Loaded(object sender, RoutedEventArgs e) {
            salesPersonDataAdapter.Fill(salesPersonDataTable);
        }
    }
}

MainWindow.xaml.vb

Imports Microsoft.VisualBasic
Imports System.Data
Imports System.Data.OleDb
Imports System.Windows
Imports DevExpress.Xpf.PivotGrid
Imports nwindDataSetTableAdapters
Imports DevExpress.XtraPivotGrid

Namespace HowToBindToMDB
    Partial Public Class MainWindow
        Inherits Window
        Private salesPersonDataTable As New NwindDataSet.SalesPersonDataTable()
        Private salesPersonDataAdapter As New SalesPersonTableAdapter()
        Private minSum As Integer = 500

        Public Sub New()
            InitializeComponent()
            pivotGridControl1.DataSource = salesPersonDataTable
        End Sub

        Private Sub Window_Loaded(ByVal sender As Object, ByVal e As RoutedEventArgs)
            salesPersonDataAdapter.Fill(salesPersonDataTable)
        End Sub
    End Class
End Namespace

Application.xaml

<Application x:Class="HowToBindToMDB.App" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" StartupUri="MainWindow.xaml">
    <Application.Resources>

    </Application.Resources>
</Application>

Application.xaml.vb

Imports Microsoft.VisualBasic
Imports System
Imports System.Collections.Generic
Imports System.Configuration
Imports System.Data
Imports System.Linq
Imports System.Windows

Namespace HowToBindToMDB
    ''' <summary>
    ''' Interaction logic for App.xaml
    ''' </summary>
    Partial Public Class App
        Inherits Application
    End Class
End Namespace