Jump to content
Software FX Community

Labels in 3D Pie chart


Recommended Posts


I like the chart control so far.  How would I go about getting labels into the slices in a 3D pie chart?

I'd like the content of the label to not be the value, e.g. it will be a formatted description from my business object.  Also I would like it to always render from left to right and not rotated with the pie chart, is this possible?



Link to comment
Share on other sites

In the following XAML the chart is plotting a property called ProductSales and the point label will show an image (property called ImageLogo} and 2 labels, the first one will show the slice value (the TooltipConverter trick also allows you to show other elements calculated by the chart such as percentages using %p), the second label shows a property in your business object called ProductName.

I also included XAML showing how to change the point colors and the AxisX.LabelPath set to ProductName. This will be used in tooltips.


cfx:Chart Gallery="Pie" x:Name="chart1" ItemsSource="{Binding Source={StaticResource productData}}"><cfx:Chart.Series><cfx:SeriesAttributesCollection><cfx:SeriesAttributes BindingPath="ProductSales"><cfx:SeriesAttributes.PointLabels><cfx:PointLabelAttributes><cfx:PointLabelAttributes.Template><DataTemplate><StackPanel Orientation="Horizontal" IsHitTestVisible="false"><Image x:Name="myImg" Source="{Binding Path=DataItem.ImageLogo}" Width="50" Height="50" VerticalAlignment="Center"/><StackPanel><Label Background="Transparent" FontFamily="{Binding Path=FontFamily}" Foreground="{Binding Path=Foreground}" FontSize="{Binding Path=FontSize}" FontStyle="{Binding Path=FontStyle}" HorizontalAlignment="Left" VerticalAlignment="Top"><Label.Content><Binding Path="Self" Converter="{StaticResource MyTooltipConverter}" ConverterParameter="%v" /></Label.Content></Label><Label Content="{Binding Path=DataItem.ProductName}" Background="Transparent" FontFamily="{Binding Path=FontFamily}" Foreground="{BindingPath=Foreground}" FontSize="{Binding Path=FontSize}" FontStyle="{Binding Path=FontStyle}" HorizontalAlignment="Left" VerticalAlignment="Top"/></StackPanel></StackPanel></DataTemplate></cfx:PointLabelAttributes.Template></cfx:PointLabelAttributes></cfx:SeriesAttributes.PointLabels></cfx:SeriesAttributes></cfx:SeriesAttributesCollection></cfx:Chart.Series><cfx:Chart.Points><cfx:PointAttributesCollection>  <cfx:PointAttributes Fill="#94FFFF00"/>  <cfx:PointAttributes Fill="#94909571"/>  <cfx:PointAttributes Fill="#94BD9B50"/>  <cfx:PointAttributes Fill="#94ffb203"/>  <cfx:PointAttributes Fill="#94b95419"/></cfx:PointAttributesCollection></cfx:Chart.Points><cfx:Chart.AxisX>  <cfx:Axis LabelPath="ProductName"/></cfx:Chart.AxisX></cfx:Chart>

To use the converter you need


And the following in your window/page resources


cfxConverters:TooltipConverter x:Key="MyTooltipConverter"/>



Link to comment
Share on other sites

  • 1 year later...
  • 3 weeks later...

Is there any way the pie labels can be selectively turned off?


Additionally, I have found that sometimes when the name of the pie slice is too large (in either the main chart or the sub-chart), it gets clipped. Is there any way to set the Z-Index of the label to the forefront so that it is not clipped?

The following screen demonstrates label clipping on the small pie for text that is too large:

Posted Image 

There's an invisible border around the chart, but there's plenty of space for the labels (it also happens on the large chart if the labels are too long).

Is there a way to prioritize rendering of labels over rendering of the chart (without labels, the chart information doesn't make much sense if the legend is turned off)?

Thank you,


Link to comment
Share on other sites

>> Is there any way the pie labels can be selectively turned off?

You can turn off labels on a per-series basis but when the user clicks one of the "small" charts it will switch places with the big one but we do not generate any events so you will not have a way to flip the per-series labels visibility.

Starting in build 3700 we have made the following changes to pie chart

1) In previous builds we forced labels in "small" pies to be inside and scaled only if the Pie properties were unchanged, now it will do it even if you change some of the pie label properties

2) We have exposed a property called ThumbnailStyle, if you set this property to 0 we will keep the old behavior respecting any label changes on the "small pies", you can also set this property to PieThumbnailStyles.HideLabels, in this case we will hide the labels for "small" pies and handle changes automatically.

>> There's an invisible border around the chart, but there's plenty of space for the labels

The reason for this is that pie charts need to have a square space, unfortunately we limit the space before the label pass, I am not sure if we can fix this on this branch but we will certainly fix this on future major versions (i.e. 8.1)



Link to comment
Share on other sites

  • 1 month later...

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...