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
         return _name;
         _name = value;
   private int _count;
   public int count
         return _count;
         _count = value;
   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() };
   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,

protected async override void OnNavigatedTo(
                         NavigationEventArgs e )
   /* ... */
   raffleChart.Series[0].ItemsSource = _vm.CountRaffle();



The view has a pie chart that looks like this,

<telerik:RadPieChart  x:Name="raffleChart"
   <telerik:PieSeries ShowLabels="True">
         <telerik:PropertyNameDataPointBinding PropertyName="count" />
         <telerik:ChartSeriesLabelDefinition Margin="-20">
                                    PropertyName="name" />

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.

Win8_Download (2)

About the Author

Jesse Liberty

 has three decades of experience writing and delivering software projects. He is the author of 2 dozen books and has been a Distinguished Software Engineer for AT&T and a VP for Information Services for Citibank and a Software Architect for PBS. You can read more on his personal blog or follow him on twitter


Comments are disabled in preview mode.