Today morning I got a call from SQL Server Guru Pinal Dave and conversations was
as below.
![Charts in Windows Phone 7]()
![Charts in Windows Phone 7]()
![Charts in Windows Phone 7]()
So, I started working on this. I decided to go ahead with hard coded data as
below,
public
class Bloggers
{
public string
Name { get; set;
}
public double
Posts { get; set;
}
}
And function returning dummy data is,
public
static List<Bloggers>
GetMembers()
{
List<Bloggers>
lstMembers = new
List<Bloggers>
{
new
Bloggers
{
Name ="Pinal",
Posts = 2000
},
new
Bloggers
{
Name ="Debugmode",
Posts = 400
},
new
Bloggers
{
Name ="Koiarala",
Posts = 1000
},
new
Bloggers
{
Name ="Mahesh",
Posts = 1500
},
};
return lstMembers;
}
![Charts in Windows Phone 7]()
<Grid
x:Name="LayoutRoot">
<controls:Panorama
Title="Bloggers">
<!--Panorama item one-->
<controls:PanoramaItem
Header="Series
Chart">
<Grid>
<charting:Chart
x:Name="seriesChart"
Background="Black">
<charting:ColumnSeries
Background="Black"
/>
</charting:Chart>
</Grid>
</controls:PanoramaItem>
<!--Panorama item two-->
<controls:PanoramaItem
Header="Pie
Chart">
<Grid>
<charting:Chart
x:Name="pieChart"></charting:Chart>
</Grid>
</controls:PanoramaItem>
<!--Panorama item three-->
<controls:PanoramaItem
Header="Scatter
Chart">
<Grid>
<charting:Chart
x:Name="scatterChart"></charting:Chart>
</Grid>
</controls:PanoramaItem>
</controls:Panorama>
</Grid>
To add chart control on XAML, I added namespace on XAML as below ,
xmlns:charting="clr-namespace:System.Windows.Controls.DataVisualization.Charting;assembly=System.Windows.Controls.DataVisualization.Toolkit"
And on code behind as below,
using System.Windows;
using System.Windows.Controls;
using Microsoft.Phone.Controls;
using System.Windows.Controls.DataVisualization.Charting;
using System.Windows.Data;
Creating Column Series
ColumnSeries series = new ColumnSeries();
seriesChart.Series.Add(series);
series.SetBinding(ColumnSeries.ItemsSourceProperty, new Binding());
series.ItemsSource = GetMembers();
series.DependentValuePath = "Posts";
series.IndependentValuePath = "Name";
There is nothing to get confused in above code. It is creating a Column Series
and adding to the chart in the first panorama item. Expected output would be as
below ,
![Column Series Windows Phone]()
Creating Pie Series
PieSeries pieSeries = new PieSeries();
pieChart.Series.Add(pieSeries);
pieSeries.SetBinding(PieSeries.ItemsSourceProperty, new Binding());
pieSeries.ItemsSource = Model.Factory.GetMembers();
pieSeries.DependentValuePath = "Posts";
pieSeries.IndependentValuePath = "Name";
Expected output is as below,
![Pie Series Windows Phone]()
Creating Scatter Series
ScatterSeries scatterSeries = new ScatterSeries();
scatterChart.Series.Add(scatterSeries);
scatterSeries.SetBinding(ScatterSeries.ItemsSourceProperty, new Binding());
scatterSeries.ItemsSource = Model.Factory.GetMembers();
scatterSeries.DependentValuePath = "Posts";
scatterSeries.IndependentValuePath = "Name";
Expected Output is as below,
![Pie Series Windows Phone]()
![Pie Series Windows Phone]()