emiliegue
emiliegue

Reputation: 53

WPF LiveCharts styling : several charts cause the second one to bug

I encounter a problem with LiveCharts:PieMenu. I have defined a style for PieChart and PieSeries on a resource file so that all my pie charts look alike. In UserControl, I use the resource file in a resource dictionary and by adding it to the resources and I create 2 pie Charts:

    <Border HorizontalAlignment="Stretch"
            Background="{StaticResource MenuBackgroundScb2}" 
            BorderThickness="2" BorderBrush="{StaticResource WidgetBorderScb}"
            Margin="0 0 0 20">
        <StackPanel HorizontalAlignment="Stretch" >
            <Label Content="Montant des offres selon leurs états" Style="{StaticResource TitleLabel}"/>
            <lc:PieChart Series="{Binding Path=AmountOfferByStatusSeriesCollection}"/>
        </StackPanel>
    </Border>
    <Border HorizontalAlignment="Stretch"
            Background="{StaticResource MenuBackgroundScb2}" 
            BorderThickness="2" BorderBrush="{StaticResource WidgetBorderScb}">
        <StackPanel HorizontalAlignment="Stretch" >
            <Label Content="Nombre d'offres selon leurs états" Style="{StaticResource TitleLabel}"/>
            <lc:PieChart Series="{Binding Path=NbOfferByStatusSeriesCollection}"  />
        </StackPanel>
    </Border>

The first chart pie looks good but there is a problem with the second one : the legend is not displayed and the mouse over makes the app crash.

bug

The bug appeared since I've declared the style in a separate resource file instead of inside the resources of the PieChart so I know I don't have a problem with the Series NbOfferByStatusSeriesCollection.

Moreover, I have a third pie which is displayed in an other page, not at the same time as the first two, and this one works fine.

What did I do wrong??

Here is the extract of the resource file.

<Style TargetType="lc:PieChart">
    <Setter Property="Height" Value="140"/>
    <Setter Property="InnerRadius" Value="25"/>
    <Setter Property="SeriesColors" Value="{StaticResource GraphColors}" />
    <Setter Property="Foreground" Value="{StaticResource LightForegroundScb}"/>
    <Setter Property="LegendLocation" Value="Right" />
    <Setter Property="ChartLegend">
        <Setter.Value>
            <lc:DefaultLegend BulletSize="20"/>
        </Setter.Value>
    </Setter>
    <Setter Property="DataTooltip">
        <Setter.Value>
            <lc:DefaultTooltip SelectionMode="OnlySender" 
                                       Foreground="{StaticResource LightForegroundScb}"
                                       Background="{StaticResource MenuBackgroundScb2}" 
                                       BorderThickness="2"
                                       BorderBrush="{StaticResource MenuBackgroundScb}"
                                       BulletSize="20" />
        </Setter.Value>
    </Setter>
</Style>

<Style TargetType="lc:PieSeries">
    <Setter Property="Stroke" Value="{StaticResource MenuBackgroundScb2}"/>
    <Setter Property="StrokeThickness" Value="3"/>
</Style>

Here is the callstack :

enter image description here

Upvotes: 1

Views: 1671

Answers (1)

emiliegue
emiliegue

Reputation: 53

Turns out I had to style the default legend and default dataTooltip outside the pie chart style and add them to the pie chart style resources :

<Style TargetType="lc:DefaultLegend" x:Key="PieChartDefaultLegend">
    <Setter Property="BulletSize" Value="20"/>
</Style>

<Style TargetType="lc:DefaultTooltip" x:Key="PieChartDefaultTooltip">
    <Setter Property="SelectionMode" Value="OnlySender"/>
    <Setter Property="Foreground" Value="{StaticResource LightForegroundScb}"/>
    <Setter Property="Background" Value="{StaticResource MenuBackgroundScb2}" />
    <Setter Property="BorderThickness" Value="2"/>
    <Setter Property="BorderBrush" Value="{StaticResource MenuBackgroundScb}"/>
    <Setter Property="BulletSize" Value="20" />
</Style>

<Style TargetType="lc:PieChart">
    <Setter Property="InnerRadius" Value="25"/>
    <Setter Property="SeriesColors" Value="{StaticResource GraphColors}" />
    <Setter Property="Foreground" Value="{StaticResource LightForegroundScb}"/>
    <Setter Property="LegendLocation" Value="Right" />
    <Style.Resources>
        <Style BasedOn="{StaticResource PieChartDefaultLegend}" TargetType="lc:DefaultLegend"/>
        <Style BasedOn="{StaticResource PieChartDefaultTooltip}" TargetType="lc:DefaultTooltip"/>
    </Style.Resources>
</Style>

Upvotes: 1

Related Questions