Home / Community & Support / Developer Productivity Tools Forums / WPF > Chart > Colour palette for 3D pie chart (WPF)

• Gary

  Posted on Jan 30, 2009 (permalink)

  Hi,
  
  I've been evaluating the WPF charting component and am really struggling to find out how to change the colour palette for a pie chart. Can anyone help?
  
  Also noticed that when you resize the width of a window containing a 3D pie chart, the chart will scale, but if you adjust the height, it doesn't. Am I doing something wrong? Code below:
  
  

  <Window x:Class="Telerik1.Window1"

  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

  xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"

  xmlns:controls="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls"

  Title="Window1" Height="600" Width="800" Loaded="ExampleControl_Loaded" Unloaded="ExampleControl_Unloaded">

  <Window.Resources>

  <Style TargetType="{x:Type telerik:RadChart}">

  <Setter Property="telerik:Theming.Theme">

  <Setter.Value>

  <telerik:VistaTheme/>

  </Setter.Value>

  </Setter>

  </Style>

  </Window.Resources>

  <Grid>

  <telerik:RadChart x:Name="RadChart1" />

  </Grid>

  </Window>

  
  
  Thanks,
  Gary.

  Reply

• Giuseppe Giuseppe

  Posted on Feb 2, 2009 (permalink)

  Hello Gary,
  
  You can review this knowledge base article here that explains how to customize the default color palette for the chart control in WPF. Basically the chart control uses the concept of style palettes in order to style the various chart series. There are distinct style palettes for the various series types (Line, Bar, Pie, etc.) and each palette can contain as many style elements as you want -- the first style is applied to the first chart series of the given type, the second - to the second series, etc.
  
  For 3D series instead of style palettes, you need to apply Materials (combined in a MaterialsCollection). You can override the default materials collection for the Vista Theme like this (the materials collection is the same for all 3D series types):
  
  

  <Window x:Class="WpfApplication6.Window2"

  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

  xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"

  Title="Window2" Height="300" Width="600">

  <Grid>

  <Grid.Resources>

  <telerik:MaterialsCollection x:Key="{telerik:ThemeResourceKey ThemeType={x:Type telerik:VistaTheme},

  ElementType={x:Type telerik:ChartArea},

  ResourceId={x:Static telerik:ResourceHelper.ResourceKey3DStyle}}" >

  <MaterialGroup>

  <MaterialGroup.Children>

  <!--<DiffuseMaterial Brush="#FF5DE7FE" />-->

  <DiffuseMaterial Brush="Lime" />

  <SpecularMaterial Brush="#FFFFFFFF" />

  <SpecularMaterial SpecularPower="0" />

  </MaterialGroup.Children>

  </MaterialGroup>

  <MaterialGroup>

  <MaterialGroup.Children>

  <!--<DiffuseMaterial Brush="#FFB9FB28" />-->

  <DiffuseMaterial Brush="Bisque" />

  <SpecularMaterial Brush="#FFFFFFFF" />

  <SpecularMaterial SpecularPower="0" />

  </MaterialGroup.Children>

  </MaterialGroup>

  <MaterialGroup>

  <MaterialGroup.Children>

  <DiffuseMaterial Brush="#FFFC298F" />

  <SpecularMaterial Brush="#FFFFFFFF" />

  <SpecularMaterial SpecularPower="0" />

  </MaterialGroup.Children>

  </MaterialGroup>

  <MaterialGroup>

  <MaterialGroup.Children>

  <DiffuseMaterial Brush="#FFD4D4D4" />

  <SpecularMaterial Brush="#FFFFFFFF" />

  <SpecularMaterial SpecularPower="0" />

  </MaterialGroup.Children>

  </MaterialGroup>

  <MaterialGroup>

  <MaterialGroup.Children>

  <DiffuseMaterial Brush="#FFFF4500" />

  <SpecularMaterial Brush="#FFFFFFFF" />

  <SpecularMaterial SpecularPower="0" />

  </MaterialGroup.Children>

  </MaterialGroup>

  <MaterialGroup>

  <MaterialGroup.Children>

  <DiffuseMaterial Brush="#FFFFAF00" />

  <SpecularMaterial Brush="#FFFFFFFF" />

  <SpecularMaterial SpecularPower="0" />

  </MaterialGroup.Children>

  </MaterialGroup>

  <MaterialGroup>

  <MaterialGroup.Children>

  <DiffuseMaterial Brush="#FF000000" />

  <SpecularMaterial Brush="#FFFFFFFF" />

  <SpecularMaterial SpecularPower="0" />

  </MaterialGroup.Children>

  </MaterialGroup>

  <MaterialGroup>

  <MaterialGroup.Children>

  <DiffuseMaterial Brush="#FFFFFFFF" />

  <SpecularMaterial Brush="#FFFFFFFF" />

  <SpecularMaterial SpecularPower="0" />

  </MaterialGroup.Children>

  </MaterialGroup>

  <MaterialGroup>

  <MaterialGroup.Children>

  <DiffuseMaterial Brush="#FF00FF00" />

  <SpecularMaterial Brush="#FFFFFFFF" />

  <SpecularMaterial SpecularPower="0" />

  </MaterialGroup.Children>

  </MaterialGroup>

  <MaterialGroup>

  <MaterialGroup.Children>

  <DiffuseMaterial Brush="#FF002FFF" />

  <SpecularMaterial Brush="#FFFFFFFF" />

  <SpecularMaterial SpecularPower="0" />

  </MaterialGroup.Children>

  </MaterialGroup>

  </telerik:MaterialsCollection>

  </Grid.Resources>

  <telerik:RadChart x:Name="RadChart1" telerik:Theming.Theme="Vista" />

  </Grid>

  </Window>

  
  
  We have  attached a runnable sample application that demonstrates changing the styles palette for 2D pie chart (Window1.xaml) and changing the materials collection for 3D chart (Window2.xaml).
  
  As for the resizing problem -- indeed you are right and we must confirm this is a problem with the current implementation of the pie chart control. We will log this issue in our bugtracking system and will forward it to our developers for further review. We have updated your Telerik points for the report.
  
  
  Kind regards,
  Manuel
  the Telerik team

  
  Check out Telerik Trainer, the state of the art learning tool for Telerik products.

  Attached files

  • wpfapplication6.zip

  Reply


• Gary

  Posted on Feb 2, 2009 (permalink)

  Thanks very much for your response, Manuel. No wonder I struggled to do it. It seems to be an extraordinarily complex API for what I would consider to be a simple operation. I've also been looking at Infragistics and they make such customizations very simple. Interestingly enough, they also suffer from exactly the same scaling bug.
  
  Gary.

  Reply

• Giuseppe Giuseppe

  Posted on Feb 4, 2009 (permalink)

  Hi Gary,
  
  Thank you for your feedback. We will forward it to our developers so they consider simplifying the skinning behavior for the future version of the chart control.
  
  
  Kind regards,
  Manuel
  the Telerik team

  
  Check out Telerik Trainer, the state of the art learning tool for Telerik products.

  Reply

• santos

  Posted on Mar 9, 2010 (permalink)

  hi:
  
  The example showed in the file above (WpfApplication6.zip) is right. But this example used a dll of version 2008. With the versión 2009 (trial), this example only show the colors in the chart. but the labels colors are other.
  
  And now???

  Reply

• santos

  Posted on Mar 9, 2010 (permalink)

  hi:
     to solve the last point. Under code was add the labels with color.
  
              pie.DataSeries.Add(series);
              ....
  
  

              ChartLegendItem e = new ChartLegendItem();

              e.Label = "description a";

              e.Background = Brushes.Green;

              e.Foreground = Brushes.Black;

              chartLegend.Items.Add(e);   //seccion of chartlegend in XAML

   

              e = new ChartLegendItem();

              e.Label = "description b";

              e.Background = Brushes.Orange;

              e.Foreground = Brushes.Black;

              chartLegend.Items.Add(e);

           ..           

              chartLegend.UseAutoGeneratedItems = false;     // disable the auto generation labels       

  Reply

• Eric

  Posted on Sep 8, 2010 (permalink)

  Using the above zip file project, if I comment out the entire <Grid.Resources> section of the Windows2.xaml file I get the same colours as if I leave it uncommented.  It seems to have no effect.  I am using Q2 2010 SP1.

  Reply

• Giuseppe Giuseppe

  Posted on Sep 13, 2010 (permalink)

  Hello Eric,
  
  In recent versions of the control there is much easier way to define color palettes through the RadChart.PaletteBrushes property:
  
  XAML
  

  <telerik:RadChart x:Name="RadChart1">

      <telerik:RadChart.PaletteBrushes>

          <SolidColorBrush Color="Red" />

          <SolidColorBrush Color="Green" />

          <SolidColorBrush Color="Blue" />

          <SolidColorBrush Color="Gainsboro" />

          <SolidColorBrush Color="GhostWhite" />

          <SolidColorBrush Color="BlueViolet" />

          <SolidColorBrush Color="Firebrick" />

          <SolidColorBrush Color="WhiteSmoke" />

      </telerik:RadChart.PaletteBrushes>

  </telerik:RadChart>

  
  C#
  

  RadChart1.DefaultSeriesDefinition = new Pie3DSeriesDefinition();

  RadChart1.ItemsSource = new int[] { 11, 20, 13, 14, 50, 10, 15 };

  
  Hope this helps.
  
  
  Kind regards,
  Freddie
  the Telerik team

  Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items

  Reply

Back to Top

Home / Community & Support / Developer Productivity Tools Forums / WPF > Chart > Colour palette for 3D pie chart (WPF)