Telerik Forums / UI for Silverlight Forum / Chart /

Problem in binding pie and bar chart values coming from database

Telerik UI for Silverlight
Resources Buy Try

2 posts, 0 answers

surya prayaga

5 posts

Member since:
Jan 2010

Posted 15 Feb 2010 Link to this post

Hi team,

I have a small problem.I'm able to bind the data coming from database to every textbox and labels but when i come to the charts i need to display the values according to them.I have my values in hand when i'm binding the values to XCategory and YValue its throwing and error.
My code looks like this

    <ItemsControl x:Name="lstPerformance" ItemsSource="{Binding ReportList}">
        <ItemsControl.ItemTemplate>
            <DataTemplate x:Name="performaceData">
                <Grid x:Name="LayoutRoot" Background="White" >



                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="100"/>
                        <ColumnDefinition Width="860"/>
                        <ColumnDefinition Width="43"/>
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                    </Grid.RowDefinitions>

                    <TextBlock x:Name="txtHead" Text="Client:" Grid.Column="1" Grid.Row="0" Margin="0,0,0,0" FontSize="8" Foreground="#FF8E8888" />
                    <TextBlock x:Name="txtHead1" Text="Facility:" Grid.Column="1" Grid.Row="0" Margin="330,0,0,0" FontSize="8" Foreground="#FF8E8888" />
                    <TextBlock x:Name="txtHead2" Text="Period:" Grid.Column="1" Grid.Row="0" Margin="660,0,0,0" FontSize="8" Foreground="#FF8E8888" />

                    <TextBlock x:Name="txtSubHead" Text="{Binding preparedFor}" TextWrapping="Wrap" Grid.Column="1" Grid.Row="1" Margin="0,0,0,0" FontSize="12" />
                    <TextBlock x:Name="txtSubHead1" Text="{Binding locationName}" TextWrapping="Wrap" Grid.Column="1" Grid.Row="1" Margin="330,0,201,0" FontSize="12" d:LayoutOverrides="GridBox" />
                    <TextBlock x:Name="txtSubHead2" Text="{Binding period}" TextWrapping="Wrap" Grid.Column="1" Grid.Row="1" Margin="660,0,0,0" FontSize="12" />
                    <Image x:Name="imgStrip" Source="../Images/strip1.jpg" Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="3" />

                    <Border Width="650" Height="26" Grid.Row="3" Grid.Column="1" BorderBrush="#c3c4c4" Margin="0,14,210,0" d:LayoutOverrides="Height" VerticalAlignment="Top">
                        <Border.Background>
                            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                <GradientStop Color="#FFF5F9FA"/>
                                <GradientStop Color="#FFCDD0D1" Offset="1"/>
                            </LinearGradientBrush>
                        </Border.Background>
                        <TextBlock Text="Timeliness of delivery for routines" Margin="0,4,0,-4" Grid.Column="1" Grid.Row="3" />

                    </Border>

                    <TextBlock Text="Percentage of orders on time." FontFamily="Geneva, Arial, Helvetica, sans-serif" FontSize="14" Foreground="#808080" Grid.Column="1" Grid.Row="4"/>

                    <StackPanel Orientation="Horizontal" Width="650" Grid.Column="1" Grid.Row="5" Margin="0,0,325,0">

                        <TextBlock Height="30" Width="325" Text="Facility Statistics" VerticalAlignment="Center" FontFamily="Geneva, Arial, Helvetica, sans-serif" FontSize="12" Foreground="#006595" ></TextBlock>
                        <TextBlock Height="30" Width="325" Text="Book of business statistics" VerticalAlignment="Center" FontFamily="Geneva, Arial, Helvetica, sans-serif" FontSize="12" Foreground="#666666"/>

                    </StackPanel>

                    <StackPanel Orientation="Horizontal" Grid.Row="6" Grid.Column="1" Margin="1,0,212,0">
                        <StackPanel Orientation="Horizontal" Width="325">
                            <telerikChart:RadChart x:Name="timeRoutPie" Background="White" Width="150" Height="150" >
                                <telerikChart:RadChart.DefaultSeriesDefinition >
                                    <telerikCharting:PieSeriesDefinition />

                                </telerikChart:RadChart.DefaultSeriesDefinition>
                                <telerikChart:RadChart.DefaultView>
                                    <telerikCharting:ChartDefaultView >
                                        <telerikCharting:ChartDefaultView.ChartLegend>
                                            <telerikCharting:ChartLegend Visibility="Collapsed">

                                            </telerikCharting:ChartLegend>
                                        </telerikCharting:ChartDefaultView.ChartLegend>
                                        <telerikCharting:ChartDefaultView.ChartArea>
                                            <telerikCharting:ChartArea>
                                                <telerikCharting:ChartArea.DataSeries>
                                                    <telerikCharting:DataSeries>
                                                        <telerikCharting:DataSeries.Definition>
                                                            <telerikCharting:PieSeriesDefinition ShowItemLabels="False">

                                                            </telerikCharting:PieSeriesDefinition>
                                                        </telerikCharting:DataSeries.Definition>
                                                        <telerikCharting:DataPoint YValue="98.62" />
                                                        <telerikCharting:DataPoint YValue="11.38" />

                                                    </telerikCharting:DataSeries>

                                                </telerikCharting:ChartArea.DataSeries>
                                            </telerikCharting:ChartArea>
                                        </telerikCharting:ChartDefaultView.ChartArea>

                                    </telerikCharting:ChartDefaultView>
                                </telerikChart:RadChart.DefaultView>
                            </telerikChart:RadChart>
                            <TextBlock Text="{Binding averageCount}" VerticalAlignment="Center" HorizontalAlignment="Center" TextAlignment="Center" Width="172" FontSize="40" Foreground="#006595" FontFamily="verdana" ></TextBlock>
                        </StackPanel>
                        <StackPanel Orientation="Horizontal" Width="325">
                            <telerikChart:RadChart x:Name="busRoutPie" Background="White" Width="150" Height="150" >
                                <telerikChart:RadChart.DefaultSeriesDefinition >
                                    <telerikCharting:PieSeriesDefinition />

                                </telerikChart:RadChart.DefaultSeriesDefinition>
                                <telerikChart:RadChart.DefaultView>
                                    <telerikCharting:ChartDefaultView >
                                        <telerikCharting:ChartDefaultView.ChartLegend>
                                            <telerikCharting:ChartLegend Visibility="Collapsed">

                                            </telerikCharting:ChartLegend>
                                        </telerikCharting:ChartDefaultView.ChartLegend>
                                        <telerikCharting:ChartDefaultView.ChartArea>
                                            <telerikCharting:ChartArea>
                                                <telerikCharting:ChartArea.DataSeries>
                                                    <telerikCharting:DataSeries>
                                                        <telerikCharting:DataSeries.Definition>
                                                            <telerikCharting:PieSeriesDefinition ShowItemLabels="False">

                                                            </telerikCharting:PieSeriesDefinition>
                                                        </telerikCharting:DataSeries.Definition>
                                                        <telerikCharting:DataPoint YValue="100" />
                                                        <telerikCharting:DataPoint YValue="0" />

                                                    </telerikCharting:DataSeries>

                                                </telerikCharting:ChartArea.DataSeries>
                                            </telerikCharting:ChartArea>
                                        </telerikCharting:ChartDefaultView.ChartArea>

                                    </telerikCharting:ChartDefaultView>
                                </telerikChart:RadChart.DefaultView>
                            </telerikChart:RadChart>
                            <TextBlock Text="{Binding routBusiAvgCount}" VerticalAlignment="Center" HorizontalAlignment="Center" TextAlignment="Center" Width="172" FontSize="40" Foreground="#a6a6a6" FontFamily="verdana"></TextBlock>
                        </StackPanel>

                    </StackPanel>
                    <StackPanel Grid.Row="7" Grid.Column="1" Orientation="Vertical">
                        <HyperlinkButton Content="Show Details" Click="HyperlinkButton_Click"></HyperlinkButton>
                        <HyperlinkButton Content="Hide Details" Visibility="Collapsed" Click="HyperlinkButton_Click_1"></HyperlinkButton>
                        <data:DataGrid Width="650" Margin="2,0,208,0" Visibility="Collapsed" AutoGenerateColumns="True" ItemsSource="{Binding reportLocations}">


                        </data:DataGrid>
                    </StackPanel>

                    <Border Width="650" Height="26" Grid.Row="8" Grid.Column="1" BorderBrush="#c3c4c4" Margin="0,14,210,0" d:LayoutOverrides="Height" VerticalAlignment="Top">
                        <Border.Background>
                            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                <GradientStop Color="#FFF5F9FA"/>
                                <GradientStop Color="#FFCDD0D1" Offset="1"/>
                            </LinearGradientBrush>
                        </Border.Background>
                        <TextBlock Text="Timeliness of delivery for STAT orders" Margin="0,4,0,-4" Grid.Column="1" Grid.Row="3" />

                    </Border>
                    <TextBlock Text="Percentage of STAT orders arrived on time." FontFamily="Geneva, Arial, Helvetica, sans-serif" FontSize="14" Foreground="#808080" Grid.Column="1" Grid.Row="9"/>

                    <StackPanel Orientation="Horizontal" Width="650" Grid.Column="1" Grid.Row="10" Margin="0,0,325,0">

                        <TextBlock Height="30" Width="325" Text="Facility Statistics" VerticalAlignment="Bottom" FontFamily="Geneva, Arial, Helvetica, sans-serif" FontSize="12" Foreground="#006595" ></TextBlock>
                        <TextBlock Height="30" Width="325" Text="Book of business statistics" VerticalAlignment="Center" FontFamily="Geneva, Arial, Helvetica, sans-serif" FontSize="12" Foreground="#666666"></TextBlock>

                    </StackPanel>

                    <StackPanel Orientation="Horizontal" Grid.Row="11" Grid.Column="1" Margin="1,0,212,0">
                        <StackPanel Orientation="Horizontal" Width="325">
                            

                            <telerikChart:RadChart x:Name="timeStatPie" Background="White" Width="150" Height="150" >
                                <telerikChart:RadChart.DefaultSeriesDefinition >
                                    <telerikCharting:PieSeriesDefinition />

                                </telerikChart:RadChart.DefaultSeriesDefinition>
                                <telerikChart:RadChart.DefaultView>
                                    <telerikCharting:ChartDefaultView >
                                        <telerikCharting:ChartDefaultView.ChartLegend>
                                            <telerikCharting:ChartLegend Visibility="Collapsed">

                                            </telerikCharting:ChartLegend>
                                        </telerikCharting:ChartDefaultView.ChartLegend>
                                        <telerikCharting:ChartDefaultView.ChartArea>
                                            <telerikCharting:ChartArea>
                                                <telerikCharting:ChartArea.DataSeries>
                                                    <telerikCharting:DataSeries>
                                                        <telerikCharting:DataSeries.Definition>
                                                            <telerikCharting:PieSeriesDefinition ShowItemLabels="False">

                                                            </telerikCharting:PieSeriesDefinition>
                                                        </telerikCharting:DataSeries.Definition>
                                                        <telerikCharting:DataPoint YValue="85" />
                                                        <telerikCharting:DataPoint YValue="15" />

                                                    </telerikCharting:DataSeries>

                                                </telerikCharting:ChartArea.DataSeries>
                                            </telerikCharting:ChartArea>
                                        </telerikCharting:ChartDefaultView.ChartArea>

                                    </telerikCharting:ChartDefaultView>
                                </telerikChart:RadChart.DefaultView>

                                
                            </telerikChart:RadChart>
                            <TextBlock Text="{Binding statAvgCount}" VerticalAlignment="Center" HorizontalAlignment="Center" TextAlignment="Center" Width="172" FontSize="40" Foreground="#006595" FontFamily="verdana"></TextBlock>
                        </StackPanel>
                        <StackPanel Orientation="Horizontal" Width="325">
                            <telerikChart:RadChart x:Name="busStatPie" Background="White" Width="150" Height="150" >
                                <telerikChart:RadChart.DefaultSeriesDefinition >
                                    <telerikCharting:PieSeriesDefinition />

                                </telerikChart:RadChart.DefaultSeriesDefinition>
                                <telerikChart:RadChart.DefaultView>
                                    <telerikCharting:ChartDefaultView >
                                        <telerikCharting:ChartDefaultView.ChartLegend>
                                            <telerikCharting:ChartLegend Visibility="Collapsed">

                                            </telerikCharting:ChartLegend>
                                        </telerikCharting:ChartDefaultView.ChartLegend>
                                        <telerikCharting:ChartDefaultView.ChartArea>
                                            <telerikCharting:ChartArea>
                                                <telerikCharting:ChartArea.DataSeries>
                                                    <telerikCharting:DataSeries>
                                                        <telerikCharting:DataSeries.Definition>
                                                            <telerikCharting:PieSeriesDefinition ShowItemLabels="False">

                                                            </telerikCharting:PieSeriesDefinition>
                                                        </telerikCharting:DataSeries.Definition>
                                                        <telerikCharting:DataPoint YValue="100" />
                                                        <telerikCharting:DataPoint YValue="0" />

                                                    </telerikCharting:DataSeries>

                                                </telerikCharting:ChartArea.DataSeries>
                                            </telerikCharting:ChartArea>
                                        </telerikCharting:ChartDefaultView.ChartArea>

                                    </telerikCharting:ChartDefaultView>
                                </telerikChart:RadChart.DefaultView>
                            </telerikChart:RadChart>
                            <TextBlock Text="{Binding statBusiAvgCount}" VerticalAlignment="Center" HorizontalAlignment="Center" TextAlignment="Center" Width="172" FontSize="40" Foreground="#a6a6a6" FontFamily="verdana"></TextBlock>
                        </StackPanel>

                    </StackPanel>

                    <StackPanel Grid.Row="12" Grid.Column="1" Orientation="Vertical">
                        <HyperlinkButton Content="Show Details" Click="HyperlinkButton_Click_2" ></HyperlinkButton>
                        <HyperlinkButton Content="Hide Details" Visibility="Collapsed" Click="HyperlinkButton_Click_3" ></HyperlinkButton>
                        <data:DataGrid Width="650" Margin="2,0,208,0" AutoGenerateColumns="True" Visibility="Collapsed" ItemsSource="{Binding statLocations}">


                            </data:DataGrid>
                    </StackPanel>

                    <Border Width="650" Height="26" Grid.Row="13" Grid.Column="1" BorderBrush="#c3c4c4" Margin="0,14,210,0" d:LayoutOverrides="Height" VerticalAlignment="Top">
                        <Border.Background>
                            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                <GradientStop Color="#FFF5F9FA"/>
                                <GradientStop Color="#FFCDD0D1" Offset="1"/>
                            </LinearGradientBrush>
                        </Border.Background>
                        <TextBlock Text="Prescription Dispensing Occurrence (PDO)" Margin="0,4,0,-4" Grid.Column="1" Grid.Row="3" />

                    </Border>
                    <TextBlock Text="Total number of PDO’s." FontFamily="Geneva, Arial, Helvetica, sans-serif" FontSize="14" Foreground="#808080" Grid.Column="1" Grid.Row="14"/>
                    <StackPanel Orientation="Horizontal" Width="650" Grid.Column="1" Grid.Row="15" Margin="0,0,325,0">
                        <TextBlock Height="30" Width="325" Text="Facility Statistics" VerticalAlignment="Bottom" FontFamily="Geneva, Arial, Helvetica, sans-serif" FontSize="12" Foreground="#006595" ></TextBlock>
                        <TextBlock Height="30" Width="325" VerticalAlignment="Center" FontFamily="Geneva, Arial, Helvetica, sans-serif" FontSize="12" Foreground="#666666"></TextBlock>

                    </StackPanel>
                    <StackPanel Width="650" Grid.Row="16" Grid.Column="1" Orientation="Horizontal">
                        <StackPanel Width="325" Orientation="Horizontal" Margin="-105,0,0,0">
                            <telerikChart:RadChart x:Name="PDOChart" Height="150" Width="150">
                                <telerikChart:RadChart.DefaultSeriesDefinition>
                                    <telerikCharting:BarSeriesDefinition />
                                </telerikChart:RadChart.DefaultSeriesDefinition>
                                
                                <telerikChart:RadChart.DefaultView>
                                    <telerikCharting:ChartDefaultView>
                                        <telerikCharting:ChartDefaultView.ChartLegend>
                                            <telerikCharting:ChartLegend Visibility="Collapsed">

                                            </telerikCharting:ChartLegend>
                                        </telerikCharting:ChartDefaultView.ChartLegend>

                                        <telerikCharting:ChartDefaultView.ChartArea>
                                            <telerikCharting:ChartArea>
                                                <telerikCharting:ChartArea.DataSeries>
                                                    <telerikCharting:DataSeries>
                                                        <telerikCharting:DataSeries.Definition>
                                                            <telerikCharting:BarSeriesDefinition>
                                                            </telerikCharting:BarSeriesDefinition>
                                                        </telerikCharting:DataSeries.Definition>
                                                        <telerikCharting:DataPoint YValue="15" />
                                                    </telerikCharting:DataSeries>
                                                </telerikCharting:ChartArea.DataSeries>
                                            </telerikCharting:ChartArea>
                                        </telerikCharting:ChartDefaultView.ChartArea>
                                    </telerikCharting:ChartDefaultView>
                                </telerikChart:RadChart.DefaultView>

                            </telerikChart:RadChart>

                        </StackPanel>
                        <StackPanel Width="325" Orientation="Horizontal">
                            <telerikChart:RadChart x:Name="PDOCategoryChart" Height="150" Width="300">
                                <telerikChart:RadChart.DefaultSeriesDefinition>
                                    <telerikCharting:HorizontalBarSeriesDefinition />
                                </telerikChart:RadChart.DefaultSeriesDefinition>
                                
                                <telerikChart:RadChart.DefaultView>
                                    <telerikCharting:ChartDefaultView>
                                        <telerikCharting:ChartDefaultView.ChartLegend>
                                            <telerikCharting:ChartLegend Visibility="Collapsed">

                                            </telerikCharting:ChartLegend>
                                        </telerikCharting:ChartDefaultView.ChartLegend>

                                        <telerikCharting:ChartDefaultView.ChartArea>
                                            <telerikCharting:ChartArea >
                                                <telerikCharting:ChartArea.DataSeries>
                                                    <telerikCharting:DataSeries >
                                                        <telerikCharting:DataSeries.Definition >
                                                            <telerikCharting:HorizontalBarSeriesDefinition>
                                                            </telerikCharting:HorizontalBarSeriesDefinition >
                                                        </telerikCharting:DataSeries.Definition >
                                                        <telerikCharting:DataPoint XCategory="Incorrect Quantity Name" YValue="1" />
                                                        <telerikCharting:DataPoint XCategory="Incorrect Strength\Dose Name" YValue="1" />
                                                        <telerikCharting:DataPoint XCategory="Incorrect Medication Name" YValue="2" />

                                                    </telerikCharting:DataSeries>
                                                </telerikCharting:ChartArea.DataSeries>
                                            </telerikCharting:ChartArea>
                                        </telerikCharting:ChartDefaultView.ChartArea>
                                    </telerikCharting:ChartDefaultView>
                                </telerikChart:RadChart.DefaultView>

                            </telerikChart:RadChart>
                        </StackPanel>

                    </StackPanel>
                    <StackPanel Grid.Row="17" Grid.Column="1" Orientation="Vertical">
                        <HyperlinkButton Content="Show Details" Click="HyperlinkButton_Click_4" ></HyperlinkButton>
                        <HyperlinkButton Content="Hide Details" Visibility="Collapsed" Click="HyperlinkButton_Click_5"></HyperlinkButton>
                        <data:DataGrid Width="650" Margin="2,0,208,0" AutoGenerateColumns="True" Visibility="Collapsed" ItemsSource="{Binding categoryStats}">

                        </data:DataGrid>
                    </StackPanel>

                    <Border Width="650" Height="26" Grid.Row="18" Grid.Column="1" BorderBrush="#c3c4c4" Margin="0,14,210,0" d:LayoutOverrides="Height" VerticalAlignment="Top">
                        <Border.Background>
                            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                <GradientStop Color="#FFF5F9FA"/>
                                <GradientStop Color="#FFCDD0D1" Offset="1"/>
                            </LinearGradientBrush>
                        </Border.Background>
                        <TextBlock Text="Customer Service Rep. (CSR)" Margin="0,4,0,-4" Grid.Column="1" Grid.Row="3" />

                    </Border>
                    <TextBlock Text="Total tickets opened." FontFamily="Geneva, Arial, Helvetica, sans-serif" FontSize="14" Foreground="#808080" Grid.Column="1" Grid.Row="19"/>
                    <StackPanel Orientation="Horizontal" Width="650" Grid.Column="1" Grid.Row="20" Margin="10,10,245,0">
                        <StackPanel Width="70" Orientation="Vertical"></StackPanel>
                        <StackPanel Width="290" Orientation="Vertical">
                            <TextBlock Height="30" Width="325" Text="Facility Statistics" TextAlignment="Left" VerticalAlignment="Center" FontFamily="Geneva, Arial, Helvetica, sans-serif" FontSize="12" Foreground="#006595" ></TextBlock>
                            <telerikChart:RadChart x:Name="CSRChart" Height="150" Width="150" >
                                <telerikChart:RadChart.DefaultSeriesDefinition>
                                    <telerikCharting:HorizontalBarSeriesDefinition />
                                </telerikChart:RadChart.DefaultSeriesDefinition>
                                
                                <telerikChart:RadChart.DefaultView>
                                    <telerikCharting:ChartDefaultView>
                                        <telerikCharting:ChartDefaultView.ChartLegend>
                                            <telerikCharting:ChartLegend Visibility="Collapsed">

                                            </telerikCharting:ChartLegend>
                                        </telerikCharting:ChartDefaultView.ChartLegend>

                                        <telerikCharting:ChartDefaultView.ChartArea>
                                            <telerikCharting:ChartArea>
                                                <telerikCharting:ChartArea.DataSeries>
                                                    <telerikCharting:DataSeries>
                                                        <telerikCharting:DataSeries.Definition>
                                                            <telerikCharting:HorizontalBarSeriesDefinition>
                                                            </telerikCharting:HorizontalBarSeriesDefinition>
                                                        </telerikCharting:DataSeries.Definition>
                                                        <telerikCharting:DataPoint XCategory="Billing" YValue="124"/>
                                                        <telerikCharting:DataPoint XCategory="Clinical" YValue="8" />
                                                        <telerikCharting:DataPoint XCategory="Pharmacies" YValue="218"/>
                                                        <telerikCharting:DataPoint XCategory="IT" YValue="1345"/>
                                                    </telerikCharting:DataSeries>
                                                </telerikCharting:ChartArea.DataSeries>
                                            </telerikCharting:ChartArea>
                                        </telerikCharting:ChartDefaultView.ChartArea>
                                    </telerikCharting:ChartDefaultView>
                                </telerikChart:RadChart.DefaultView>

                            </telerikChart:RadChart>
                        </StackPanel>
                        <StackPanel Width="290" Orientation="Vertical">
                            <TextBlock Height="30" Width="325" Text="Book of business statistics" TextAlignment="Left" VerticalAlignment="Center" FontFamily="Geneva, Arial, Helvetica, sans-serif" FontSize="12" Foreground="#666666"></TextBlock>
                            <telerikChart:RadChart x:Name="CSRBussinessChart" Height="150" Width="150">
                                <telerikChart:RadChart.DefaultSeriesDefinition>
                                    <telerikCharting:HorizontalBarSeriesDefinition />
                                </telerikChart:RadChart.DefaultSeriesDefinition>
                                
                                <telerikChart:RadChart.DefaultView>
                                    <telerikCharting:ChartDefaultView>
                                        <telerikCharting:ChartDefaultView.ChartLegend>
                                            <telerikCharting:ChartLegend Visibility="Collapsed">

                                            </telerikCharting:ChartLegend>
                                        </telerikCharting:ChartDefaultView.ChartLegend>

                                        <telerikCharting:ChartDefaultView.ChartArea>
                                            <telerikCharting:ChartArea>
                                                <telerikCharting:ChartArea.DataSeries>
                                                    <telerikCharting:DataSeries>
                                                        <telerikCharting:DataSeries.Definition>
                                                            <telerikCharting:HorizontalBarSeriesDefinition>
                                                            </telerikCharting:HorizontalBarSeriesDefinition>
                                                        </telerikCharting:DataSeries.Definition>
                                                        <telerikCharting:DataPoint XCategory="Billing" YValue="124"/>
                                                        <telerikCharting:DataPoint XCategory="Clinical" YValue="8" />
                                                        <telerikCharting:DataPoint XCategory="Pharmacies" YValue="218"/>
                                                        <telerikCharting:DataPoint XCategory="IT" YValue="1345"/>
                                                    </telerikCharting:DataSeries>
                                                </telerikCharting:ChartArea.DataSeries>
                                            </telerikCharting:ChartArea>
                                        </telerikCharting:ChartDefaultView.ChartArea>
                                    </telerikCharting:ChartDefaultView>
                                </telerikChart:RadChart.DefaultView>

                            </telerikChart:RadChart>
                        </StackPanel>

                    </StackPanel>
                    <StackPanel Grid.Row="21" Grid.Column="1" Orientation="Vertical">
                        <HyperlinkButton Content="Show Details" Click="HyperlinkButton_Click_6" ></HyperlinkButton>
                        <HyperlinkButton Content="Hide Details" Visibility="Collapsed" Click="HyperlinkButton_Click_7" ></HyperlinkButton>
                        <data:DataGrid Width="650" Margin="2,0,208,0" AutoGenerateColumns="True" Visibility="Collapsed" ItemsSource="{Binding ctgCount}">

                        </data:DataGrid>
                    </StackPanel>

                    <Border Width="650" Height="26" Grid.Row="22" Grid.Column="1" BorderBrush="#c3c4c4" Margin="0,14,210,0" d:LayoutOverrides="Height" VerticalAlignment="Top">
                        <Border.Background>
                            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                <GradientStop Color="#FFF5F9FA"/>
                                <GradientStop Color="#FFCDD0D1" Offset="1"/>
                            </LinearGradientBrush>
                        </Border.Background>
                        <TextBlock Text="System Uptime" Margin="0,4,0,-4" Grid.Column="1" Grid.Row="22" />

                    </Border>
                    <TextBlock Text="System Uptime" FontFamily="Geneva, Arial, Helvetica, sans-serif" FontSize="14" Foreground="#808080" Grid.Column="1" Grid.Row="23"/>
                    <StackPanel Orientation="Horizontal" Width="650" Grid.Column="1" Grid.Row="24" Margin="0,0,325,0">

                        <TextBlock Height="30" Width="325" Text="Facility Statistics" VerticalAlignment="Center" FontFamily="Geneva, Arial, Helvetica, sans-serif" FontSize="12" Foreground="#006595" ></TextBlock>
                        <TextBlock Height="30" Width="325" Text="Book of business statistics" VerticalAlignment="Center" FontFamily="Geneva, Arial, Helvetica, sans-serif" FontSize="12" Foreground="#666666"></TextBlock>

                    </StackPanel>

                    <StackPanel Orientation="Horizontal" Grid.Row="25" Grid.Column="1" Margin="1,0,212,0">
                        <StackPanel Orientation="Horizontal" Width="325">
                            <telerikChart:RadChart x:Name="timeUpPie" Background="White" Width="150" Height="150" ItemsSource="{Binding ReportList}" >
                                <telerikChart:RadChart.DefaultSeriesDefinition >
                                    <telerikCharting:PieSeriesDefinition />

                                </telerikChart:RadChart.DefaultSeriesDefinition>
                                <telerikChart:RadChart.DefaultView>
                                    <telerikCharting:ChartDefaultView >
                                        <telerikCharting:ChartDefaultView.ChartLegend>
                                            <telerikCharting:ChartLegend Visibility="Collapsed">

                                            </telerikCharting:ChartLegend>
                                        </telerikCharting:ChartDefaultView.ChartLegend>
                                        <telerikCharting:ChartDefaultView.ChartArea>
                                            <telerikCharting:ChartArea>
                                                <telerikCharting:ChartArea.DataSeries>
                                                    <telerikCharting:DataSeries>
                                                        <telerikCharting:DataSeries.Definition>
                                                            <telerikCharting:PieSeriesDefinition ShowItemLabels="False">

                                                            </telerikCharting:PieSeriesDefinition>
                                                        </telerikCharting:DataSeries.Definition>
                                                        <telerikCharting:DataPoint YValue="100" />
                                                        <telerikCharting:DataPoint YValue="0" />

                                                    </telerikCharting:DataSeries>

                                                </telerikCharting:ChartArea.DataSeries>
                                            </telerikCharting:ChartArea>
                                        </telerikCharting:ChartDefaultView.ChartArea>

                                    </telerikCharting:ChartDefaultView>
                                </telerikChart:RadChart.DefaultView>
                            </telerikChart:RadChart>
                            <TextBlock Text="" VerticalAlignment="Center" HorizontalAlignment="Center" TextAlignment="Center" Width="172" FontSize="40" Foreground="#006595" FontFamily="verdana" ></TextBlock>
                        </StackPanel>
                        <StackPanel Orientation="Horizontal" Width="325">
                            <telerikChart:RadChart x:Name="busUpPie" Background="White" Width="150" Height="150" >
                                <telerikChart:RadChart.DefaultSeriesDefinition >
                                    <telerikCharting:PieSeriesDefinition />

                                </telerikChart:RadChart.DefaultSeriesDefinition>
                                <telerikChart:RadChart.DefaultView>
                                    <telerikCharting:ChartDefaultView >
                                        <telerikCharting:ChartDefaultView.ChartLegend>
                                            <telerikCharting:ChartLegend Visibility="Collapsed">

                                            </telerikCharting:ChartLegend>
                                        </telerikCharting:ChartDefaultView.ChartLegend>
                                        <telerikCharting:ChartDefaultView.ChartArea>
                                            <telerikCharting:ChartArea>
                                                <telerikCharting:ChartArea.DataSeries>
                                                    <telerikCharting:DataSeries>
                                                        <telerikCharting:DataSeries.Definition>
                                                            <telerikCharting:PieSeriesDefinition ShowItemLabels="False">

                                                            </telerikCharting:PieSeriesDefinition>
                                                        </telerikCharting:DataSeries.Definition>
                                                        <telerikCharting:DataPoint YValue="99.6" />
                                                        <telerikCharting:DataPoint YValue="0.4" />

                                                    </telerikCharting:DataSeries>

                                                </telerikCharting:ChartArea.DataSeries>
                                            </telerikCharting:ChartArea>
                                        </telerikCharting:ChartDefaultView.ChartArea>

                                    </telerikCharting:ChartDefaultView>
                                </telerikChart:RadChart.DefaultView>
                            </telerikChart:RadChart>
                            <TextBlock Text="{Binding routBusiAvgCount}" VerticalAlignment="Center" HorizontalAlignment="Center" TextAlignment="Center" Width="172" FontSize="40" Foreground="#a6a6a6" FontFamily="verdana"></TextBlock>
                        </StackPanel>

                    </StackPanel>
                    <StackPanel Grid.Row="26" Grid.Column="1" Orientation="Vertical">
                        <HyperlinkButton Content="Show Details" Visibility="Visible" Click="HyperlinkButton_Click_9"></HyperlinkButton>
                        <HyperlinkButton Content="Hide Details" Visibility="Collapsed" Click="HyperlinkButton_Click_10"></HyperlinkButton>
                        <data:DataGrid Width="650" Margin="2,0,208,0" AutoGenerateColumns="True" Visibility="Collapsed">
                            </data:DataGrid>
                    </StackPanel>

                    <TextBlock Text="Performance notes:" Grid.Row="3" Grid.Column="1" TextAlignment="Left" FontFamily="Geneva, Arial, Helvetica, sans-serif" FontWeight="Bold" FontSize="10" Foreground="#808080" HorizontalAlignment="Right" Margin="0,0,53,0" Width="137" Height="18" VerticalAlignment="Bottom" RenderTransformOrigin="0.628,1.889"/>
                    <Border HorizontalAlignment="Right" Margin="0,5,10,-37" Width="181" Grid.Column="1" Grid.Row="4" Grid.RowSpan="2" BorderBrush="#FFEAE4E4" BorderThickness="1">
                       <TextBlock Margin="5,6,6,0" Text="Currently no notes is avaialablle for these locations" TextWrapping="Wrap" Height="65" VerticalAlignment="Top"/>
                    </Border>
                    <HyperlinkButton HorizontalAlignment="Right" Margin="0,43,108,0" VerticalAlignment="Top" Content="Edit Comment" Grid.Column="1" Grid.Row="6" Click="HyperlinkButton_Click_8"/>

                </Grid>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>

Please looking forward for ur reply how to bind the data

Regards
Surya
Nikolay
Admin

397 posts
Posted 17 Feb 2010 Link to this post

Hi Surya Prayaga,

Could you, please, elaborate on what exactly the error is, it appears that you do not bind the XCategory and YValue properties and you simply declare them, which doesn't seem to cause any improper behavior.

You can find attached a solution, in which I have extracted only the charts from your code and it runs without any errors (albeit mussy due to the lack of grid ), so it'd be helpful if you could send us a sample project (or modify this one) in which the error you get is isolated.

You can find examples on how to databind to a chart in this and this help topics, which cover different databinding scenarios. Also, in this topic you can find how to databind to multiple chart areas, which seems to be the closest to your specific scenario.

Sincerely yours,
Nikolay
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.

chartapplication.rar

Problem in binding pie and bar chart values coming from database

surya prayaga

Nikolay