This is a migrated thread and some comments may be shown as answers.

Simple Pie Chart in XMAL

3 Answers 243 Views
Chart
This is a migrated thread and some comments may be shown as answers.
Pat Tormey
Top achievements
Rank 1
Pat Tormey asked on 31 Mar 2011, 03:33 PM
I'm using Blend and MVVM so I'd like to learn how to use radChart to make a simple Pie chart.
I thought I'd start with the XMAL mock up and bind it later.
All I need to do is preset 3 categories, 3 slices of pie and set the background color (fixed per slice) and show the percents of each slice as I got. The number of slices if fixed at 3..

This sample does all that (except color and percent) Note: thanks to whomever I stole it from..

Any advice?
Thanks  Pat NH USA

  <telerik:RadChart Name="Chart"
                    BorderBrush="#FF001900"
                    BorderThickness="2">                   
                <telerik:RadChart.DefaultView>
                    <telerik:ChartDefaultView>  
                        <telerik:ChartDefaultView.ChartLegend>
                            <telerik:ChartLegend
                                x:Name="ChartLegend"
                                UseAutoGeneratedItems="True" />
                        </telerik:ChartDefaultView.ChartLegend>
                        <telerik:ChartDefaultView.ChartArea>
                            <telerik:ChartArea
                                Name="ChartArea"
                                LegendName="ChartLegend"                                 
                                ClipToBounds="False" >
                                    <telerik:ChartArea.DataSeries>
                                    <telerik:DataSeries>
                                        <telerik:DataSeries.Definition>
                                                <telerik:PieSeriesDefinition></telerik:PieSeriesDefinition>
                                        </telerik:DataSeries.Definition>
                                        <telerik:DataPoint
                                            YValue="15"                                          
                                            LegendLabel="CATAGORY1" />
                                        <telerik:DataPoint
                                            YValue="9"
                                            LegendLabel="CATAGORY2"
                                                Label="" />
                                        <telerik:DataPoint
                                            YValue="12"
                                            LegendLabel="CATAGORY3" />
                                    </telerik:DataSeries>
                                </telerik:ChartArea.DataSeries>
                            </telerik:ChartArea>
                        </telerik:ChartDefaultView.ChartArea>
                    </telerik:ChartDefaultView>
                </telerik:RadChart.DefaultView>
                </telerik:RadChart>

3 Answers, 1 is accepted

Sort by
0
Accepted
Sia
Telerik team
answered on 01 Apr 2011, 12:50 PM
Hi Pat Tormey,

Here is what you need:
<telerik:RadChart Name="Chart" >
    <telerik:RadChart.PaletteBrushes>
        <SolidColorBrush Color="Blue" />
        <SolidColorBrush Color="Orange" />
        <SolidColorBrush Color="Green" />
    </telerik:RadChart.PaletteBrushes>
    <telerik:RadChart.DefaultView>
        <telerik:ChartDefaultView>
            <telerik:ChartDefaultView.ChartLegend>
                <telerik:ChartLegend x:Name="ChartLegend" />
            </telerik:ChartDefaultView.ChartLegend>
            <telerik:ChartDefaultView.ChartArea>
                <telerik:ChartArea Name="ChartArea"  LegendName="ChartLegend" ClipToBounds="False" >
                    <telerik:ChartArea.DataSeries>
                        <telerik:DataSeries>
                            <telerik:DataSeries.Definition>
                                <telerik:PieSeriesDefinition ItemLabelFormat="#%{P2}" />
                            </telerik:DataSeries.Definition>
                            <telerik:DataPoint
                                    YValue="10"                                         
                                    LegendLabel="CATAGORY1" />
                            <telerik:DataPoint
                                    YValue="10"
                                    LegendLabel="CATAGORY2"
                                        Label="" />
                            <telerik:DataPoint
                                    YValue="10"
                                    LegendLabel="CATAGORY3" />
                        </telerik:DataSeries>
                    </telerik:ChartArea.DataSeries>
                </telerik:ChartArea>
            </telerik:ChartDefaultView.ChartArea>
        </telerik:ChartDefaultView>
    </telerik:RadChart.DefaultView>
</telerik:RadChart>

I hope this helps!

Best wishes,
Sia
the Telerik team
0
Avinash
Top achievements
Rank 1
answered on 19 Apr 2011, 01:11 AM
Hi,

Can you please provide some help how can i achieve Pie explode effect in WPF RadChart with following Code.

I am not able to get Explode property.

RadChart radChart = new RadChart();
 radChart.DefaultView.ChartTitle.Content = "Compliance Chart";
                    radChart.DefaultView.ChartArea.ItemClick += new EventHandler<ChartItemClickEventArgs>(ChartArea_ItemClick);
                    radChart.DefaultView.ChartTitle.HorizontalAlignment = System.Windows.HorizontalAlignment.Center;
                    radChart.DefaultView.ChartLegend.UseAutoGeneratedItems = true;

                    radChart.DefaultView.ChartArea.AnimationSettings = new AnimationSettings();
                    radChart.DefaultView.ChartArea.AnimationSettings.ItemDelay = new TimeSpan(10);
                    radChart.DefaultView.ChartArea.AnimationSettings.ItemAnimationDuration = new TimeSpan(0, 0, 3);
                    

                    
                    DataSeries doughnutSeries = new DataSeries();
                    doughnutSeries.LegendLabel = "Compliance";
                    doughnutSeries.Definition = new Pie3DSeriesDefinition();

                    InteractivitySettings interactivitySettings = new InteractivitySettings();
                    interactivitySettings.SelectionMode = ChartSelectionMode.Multiple;
                    interactivitySettings.SelectionScope = InteractivityScope.Item;
                    interactivitySettings.HoverScope = InteractivityScope.Item;

                    doughnutSeries.Definition.InteractivitySettings = interactivitySettings;             

                    AnimationSettings aniSettings = new AnimationSettings();
                    
                    doughnutSeries.Add(new DataPoint() { YValue = Convert.ToDouble(values.Fully), LegendLabel = "Fully", Tooltip = "Fully"});
                    doughnutSeries.Add(new DataPoint() { YValue = Convert.ToDouble(values.Partial), LegendLabel = "Partial", Tooltip = "Partial" });
                    doughnutSeries.Add(new DataPoint() { YValue = Convert.ToDouble(values.NonCompliant), LegendLabel = "NonCompliant", Tooltip = "NonCompliant" });

                    radChart.DefaultView.ChartArea.DataSeries.Add(doughnutSeries);

                    radgrid.Children.Add(radChart);

thanks,
Avinash
0
Sia
Telerik team
answered on 20 Apr 2011, 03:07 PM
Hello Avinash,

As noted in the documentation interactivity effects are supported for .NET4 projects only -- we suppose you use the .NET3.5 binaries and that is why you are experiencing the described problem.

Please check this and let us know if you need additional help.

Kind regards,
Sia
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
Tags
Chart
Asked by
Pat Tormey
Top achievements
Rank 1
Answers by
Sia
Telerik team
Avinash
Top achievements
Rank 1
Share this question
or