Set Pie Chart Slice Colors from Code Behind

[GPJ]

Is there any way to set the PieChart slice colors from code behind?  I know how to do it with other chart styles (i.e. for line charts .. I use <series>.Definition.Appearance.Stroke/Fill).  But when you use that same idea for pie charts, all the slices are the same color.  Which I expect since I've only got one series.

            var series = new DataSeries { Definition = new PieSeriesDefinition() };
            series.Definition.ShowItemLabels = true;
            series.Add(new DataPoint(_dataList.A, _dataList.A));
            series.Add(new DataPoint(_dataList.B, _dataList.B));

            //series[0].LegendLabel = "Series A";
            //series[1].LegendLabel = "Series B";

            // this is what I do in other charts for each series... but pie charts don't work.
            //series.Definition.Appearance.Stroke = new SolidColorBrush(Colors.Black);
            //series.Definition.Appearance.Fill = new SolidColorBrush(myCustomColor);

            RadChart1.DefaultView.ChartArea.DataSeries.Add(series);

If I change the theme colours in XAML using the StylesPalette, the colors change.  But I really want to change them from code (dynamic when a user control starts up only, not necessarily dynamic while the app is running).   Any ideas?  Could the color of of the Fill property in the Xaml be changed using binding?

            <SolidColorBrush x:Key="RadialItemStroke" Color="#FF000000"/>
            <system:Double x:Key="RadialItemStrokeThickness">2</system:Double>
            <telerikStyling:StylesPalette x:Key="{telerikStyling:ThemeResourceKey
                    ThemeType={x:Type telerikStyling:Office_BlackTheme},
                    ElementType={x:Type telerikStyling:ChartArea},
                    ResourceId={x:Static telerikStyling:ResourceHelper.ResourceKeyRadialStyle}}">
                <Style TargetType="{x:Type Shape}">
                    <Setter Property="Stroke" Value="{StaticResource RadialItemStroke}" />
                    <Setter Property="StrokeThickness" Value="{StaticResource RadialItemStrokeThickness}" />
                    <Setter Property="Fill" Value="{Insert some binding expression here?}" />
                </Style>
                <Style TargetType="{x:Type Shape}">
                    <Setter Property="Stroke" Value="{StaticResource RadialItemStroke}" />
                    <Setter Property="StrokeThickness" Value="{StaticResource RadialItemStrokeThickness}" />
                    <Setter Property="Fill" Value="{Insert some binding expression here?}" />
                </Style>
            </telerikStyling:StylesPalette>

Thanks
Greg

[Giuseppe]

Hello Greg,

You can use dynamic resources to achieve the desired functionality like this (effectively you are changing the brushes in code behind, and they get re-applied due to the dynamic resource mechanism):

XAML:

<Grid x:Name="LayoutRoot">
    <Grid.Resources>
        <SolidColorBrush x:Key="CustomBrush" Color="Red" />
        <SolidColorBrush x:Key="CustomBrush2" Color="Green" />

        <telerikStyling:StylesPalette x:Key="{Controls:ThemeResourceKey
                ThemeType={x:Type Controls:Office_BlackTheme},
                ElementType={x:Type telerikStyling:ChartArea},
                ResourceId={x:Static telerikStyling:ResourceHelper.ResourceKeyRadialStyle}}">
            <Style TargetType="{x:Type Shape}">
                <Setter Property="Stroke" Value="White" />
                <Setter Property="StrokeThickness" Value="2" />
                <Setter Property="Fill" Value="{DynamicResource CustomBrush}" />
            </Style>
            <Style TargetType="{x:Type Shape}">
                <Setter Property="Stroke" Value="White" />
                <Setter Property="StrokeThickness" Value="2" />
                <Setter Property="Fill" Value="{DynamicResource CustomBrush2}" />
            </Style>
        </telerikStyling:StylesPalette>

    </Grid.Resources>
    <telerik:RadChart x:Name="RadChart1" />
    <Button Content="Swap" Click="Button_Click" Height="20" Width="50" />
</Grid>

C#:

private void Button_Click(object sender, RoutedEventArgs e)
{
    this.LayoutRoot.Resources["CustomBrush"] = new SolidColorBrush(Colors.PaleGoldenrod);
    this.LayoutRoot.Resources["CustomBrush2"] = new SolidColorBrush(Colors.Lime);
}

Hope this helps.


Sincerely yours,
Manuel
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[ESTHER]

hi,

 

i want to change the color of pie chart slice, how to change that color, according to our requirements.

 

 

[Martin Ivanov]

Hello Esther,

You can use the PieSeries' DefaultSliceStyle, SliceStyles and SliceStyleSelector properties. Check the Customizing PieChart Series help article.

Regards,
Martin Ivanov
Progress Telerik