Windows 8–Conference Buddy: Pie Chart of statistics

One of the pieces of information that we’re gathering in Conference Buddy is whether or not the contact (that’s you) is interested in entering our raffle for the current conference.  We’d like to display that information in a pie chart. 

There are a number of ways of attacking this problem.  We could work directly with the Contact object but that is pretty big.  Another approach is to create a Raffle class that will carry the information of how many yes’s and how many no’s we’ve received. This class will have two properties: name (for yes or no) and count (for how many),

public class Raffle : INotifyPropertyChanged
{
   private string _name;
   public string name
   {
      get
      {
         return _name;
      }
      set
      {
         _name = value;
         OnPropertyChanged();
      }
   }
   private int _count;
   public int count
   {
      get
      {
         return _count;
      }
      set
      {
         _count = value;
         OnPropertyChanged();
      }
   }
   public event PropertyChangedEventHandler PropertyChanged;
   private void OnPropertyChanged(
       [CallerMemberName] string caller = "" )
   {
      if ( PropertyChanged != null )
      {
         PropertyChanged( this,
            new PropertyChangedEventArgs( caller ) );
      }
   }
}
 With this class in hand, I can query my collection of contacts and create two instances of Raffle,

 
public List<Raffle> CountRaffle()
{
 
   List<Raffle>listOfRaffles = new List<Raffle>();
   var raffles = from c in contacts
                 where c.raffle == true
                 select c;
 
   Raffle r1 = new Raffle() 
        { name = "Yes", count = raffles.Count() };
   Raffle r2 = new Raffle() 
        { name = "No", count = contacts.Count() - raffles.Count() };
   listOfRaffles.Add(r1);
   listOfRaffles.Add(r2);
   return listOfRaffles;
}
 

The resulting list becomes the itemssource for my pie chart.  The CountRaffle() method is in the ViewModel but the assignment as the ItemsSource occurs in the code behind,

The view has a pie chart that looks like this,

<telerik:RadPieChart  x:Name="raffleChart"
                      Width="300"
                      Height="300"
                      Grid.Row="1"
                      VerticalAlignment="Top"
                      ClipToBounds="False"
                      PaletteName="DefaultDark">
   <telerik:PieSeries ShowLabels="True">
      <telerik:PieSeries.ValueBinding>
         <telerik:PropertyNameDataPointBinding PropertyName="count" />
      </telerik:PieSeries.ValueBinding>
      <telerik:PieSeries.LabelDefinitions>
         <telerik:ChartSeriesLabelDefinition Margin="-20">
            <telerik:ChartSeriesLabelDefinition.Binding>
               <telerik:PropertyNameDataPointBinding
                                    PropertyName="name" />
            </telerik:ChartSeriesLabelDefinition.Binding>
         </telerik:ChartSeriesLabelDefinition>
      </telerik:PieSeries.LabelDefinitions>
   </telerik:PieSeries>
</telerik:RadPieChart>
 

Notice that the ValueVinding is to count and the Label binding is to name, both properties of the Raffle class.  This renders a pie chart that looks like this,

In our sample 11 of the 21 contacts did request to be entered in the raffle, and you can easily see that slightly more than 50% wanted to participate.

There is much more than can be done with pie chart specifically and Telerik Charts for Windows 8 in general, and in coming posts I’ll look at how to convey some of the information we are gathering using our charts, gauges and etc.