Search code examples
c#wpfxamlchartswpftoolkit

WPF Toolkit Chart - possible to have Legend in tabular format?

Is it possible to have a ListView to display LegendItems? Looking at this style, I see that LegendItems are displayed in ItemsPresenter here:

<chartingtoolkit:Chart.LegendStyle>
    <Style TargetType="visualizationtoolkit:Legend">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="visualizationtoolkit:Legend">
                    <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="2">
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto" />
                                <RowDefinition />
                            </Grid.RowDefinitions>
                            <visualizationtoolkit:Title Grid.Row="0" x:Name="HeaderContent" Content="{TemplateBinding Header}" ContentTemplate="{TemplateBinding HeaderTemplate}" Style="{TemplateBinding TitleStyle}" />
                            <ScrollViewer Grid.Row="1" VerticalScrollBarVisibility="Auto" BorderThickness="0" Padding="0" IsTabStop="False">
                                <ItemsPresenter x:Name="Items" Margin="10,0,10,10">
                                    <!-- Displays legend items -->
                                </ItemsPresenter>
                            </ScrollViewer>
                        </Grid>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</chartingtoolkit:Chart.LegendStyle>

Im tryin go modify chart's LegendItems, to bind more fields to them, and I want them displayed in something like ListView or GridView - to have all fields displayed as a nicely formatted table

Solution

  • Simply replace ItemsPresenter with ListView:

    enter image description here

    <Window
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:WpfApp25"
    xmlns:visualizationToolkit="clr-namespace:System.Windows.Controls.DataVisualization;assembly=System.Windows.Controls.DataVisualization.Toolkit" 
    xmlns:chartingToolkit="clr-namespace:System.Windows.Controls.DataVisualization.Charting;assembly=System.Windows.Controls.DataVisualization.Toolkit" 
    x:Class="WpfApp25.MainWindow"
    mc:Ignorable="d"
    Title="MainWindow" Height="350" Width="525">
<Window.Resources>

    <Style x:Key="LegendStyle1" TargetType="{x:Type visualizationToolkit:Legend}">
        <Setter Property="Header" Value="My Custom Legend"/>
        <Setter Property="BorderBrush" Value="Black"/>
        <Setter Property="BorderThickness" Value="1"/>
        <Setter Property="IsTabStop" Value="False"/>
        <Setter Property="Margin" Value="10,0,0,15"/>
        <Setter Property="TitleStyle">
            <Setter.Value>
                <Style TargetType="{x:Type visualizationToolkit:Title}">
                    <Setter Property="Margin" Value="0,5,0,10"/>
                    <Setter Property="FontWeight" Value="Bold"/>
                    <Setter Property="HorizontalAlignment" Value="Center"/>
                </Style>
            </Setter.Value>
        </Setter>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type visualizationToolkit:Legend}">
                    <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Padding="2">
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition/>
                            </Grid.RowDefinitions>
                            <visualizationToolkit:Title x:Name="HeaderContent" ContentTemplate="{TemplateBinding HeaderTemplate}" Content="{TemplateBinding Header}" Grid.Row="0" Style="{TemplateBinding TitleStyle}"/>
                            <ScrollViewer BorderThickness="0" IsTabStop="False" Padding="0" Grid.Row="1" VerticalScrollBarVisibility="Auto">
                                <ListView ItemsSource="{Binding}">
                                    <ListView.View>
                                        <GridView>
                                            <GridViewColumn Header="Col X" DisplayMemberBinding="{Binding Path=X}"></GridViewColumn>
                                            <GridViewColumn Header="Col Y" DisplayMemberBinding="{Binding Path=Y}"></GridViewColumn>
                                        </GridView>
                                    </ListView.View>
                                </ListView>
                            </ScrollViewer>
                        </Grid>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

</Window.Resources>

<Grid>

    <chartingToolkit:Chart Title="Chart Title" LegendStyle="{StaticResource LegendStyle1}">
        <chartingToolkit:Chart.DataContext>
            <PointCollection>1,10 2,20 3,30 4,40</PointCollection>
        </chartingToolkit:Chart.DataContext>
        <chartingToolkit:Chart.Series>
            <chartingToolkit:ColumnSeries DependentValuePath="Y" 
                                      IndependentValuePath="X" 
                                      ItemsSource="{Binding}"/>
        </chartingToolkit:Chart.Series>
    </chartingToolkit:Chart>

</Grid>