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

[Solved] Display/Update GridView after series in chart is clicked on

5 Answers 152 Views

Chart

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

This question is locked. New answers and comments are not allowed.

jfkrueger asked on 06 Jun 2011, 11:43 PM

Hello,

I been following several of the examples trying to get my scenario to work. What I'm trying to do is to display a bar chart that the user can select one of the bars which will cause a GridView to be displayed based on what was clicked. Kind of a drill-down but not to another chart. I have used the example from here: http://www.telerik.com/help/silverlight/radchart-features-interactivity.html in order to capture the click and get all the needed values etc. to pass to my service to return the data. Data is being returned but the grid is not updating (or ever getting any data into it).

Below is the code I am using:

Imports Telerik.Windows.Controls.Charting

Imports System.ComponentModel

Partial Public Class MainPage

Inherits UserControl

Implements INotifyPropertyChanged

Private _summaryData As List(Of CostAndUtilizationSummaryMeasuresDataViewModel)

#Region "Public Events"

Public Event PropertyChanged As PropertyChangedEventHandler Implements INotifyPropertyChanged.PropertyChanged

#End Region

Public Sub New()

InitializeComponent()

RadGridView1.ItemsSource = SummaryData

End Sub

Private Sub NotifyPropertyChanged(ByVal info As String)

RaiseEvent PropertyChanged(Me, New PropertyChangedEventArgs(info))

End Sub

Public Property SummaryData As List(Of CostAndUtilizationSummaryMeasuresDataViewModel)

Get

Return _summaryData

End Get

Set(ByVal value As List(Of CostAndUtilizationSummaryMeasuresDataViewModel))

_summaryData = value

' Call NotifyPropertyChanged when the property is updated

NotifyPropertyChanged("SummaryData")

End Set

End Property

Private Sub ChartArea_ItemClick(ByVal sender As Object, ByVal e As ChartItemClickEventArgs)

Dim myData As CostIndexSummaryDataViewModel = TryCast(e.DataPoint.DataItem, CostIndexSummaryDataViewModel)

Dim lServiceCategory As String = myData.Data.ServiceCategory

Dim lProviderService As New ProviderService.ProviderDashboardServiceClient()

AddHandler lProviderService.GetCostAndUtilizationSummaryMeasuresForServiceCategoryCompleted, AddressOf GetCostAndUtilizationSummaryMeasuresForServiceCategoryCallback

lProviderService.GetCostAndUtilizationSummaryMeasuresForServiceCategoryAsync(lServiceCategory)

End Sub

Private Sub GetCostAndUtilizationSummaryMeasuresForServiceCategoryCallback(ByVal sender As Object, ByVal e As ProviderService.GetCostAndUtilizationSummaryMeasuresForServiceCategoryCompletedEventArgs)

Dim lRecord As Dictionary(Of String, String) = e.Result

Dim lDatalist As New List(Of CostAndUtilizationSummaryMeasuresData)

lDatalist.Add(New CostAndUtilizationSummaryMeasuresData(lRecord("ServiceCategory"),

lRecord("ActualEncounters"),

lRecord("PeerEncounters"),

lRecord("ActualCostPerEpisode"),

lRecord("PeerCostPerEpisode"),

lRecord("CostPerEpisodeIndex"),

lRecord("ActualTotalCost")))

Dim lModelList As New List(Of CostAndUtilizationSummaryMeasuresDataViewModel)

For Each lDataItem As CostAndUtilizationSummaryMeasuresData In lDatalist

lModelList.Add(New CostAndUtilizationSummaryMeasuresDataViewModel(lDataItem))

Next

SummaryData = lModelList

End Sub

End Class

The SummaryData does have values in the (0) index, the property is being set, and the NotifyPropertyChanged event is firing, however the grid never has any data in it. Below is the xaml:

<UserControl x:Class="MyCompany.Silverlight.Controls.MainPage"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"

mc:Ignorable="d" d:DesignWidth="600" d:DesignHeight="500"

xmlns:myNamespace="clr-namespace:Ebms.Silverlight.Controls">

<UserControl.DataContext>

<myNamespace:CostIndexSummaryViewModel />

</UserControl.DataContext>

<UserControl.Resources>

<Style x:Key="CustomStyle" TargetType="telerik:Bar">

<Setter Property="Template">

<Setter.Value>

<ControlTemplate TargetType="telerik:Bar">

<Canvas>

<Rectangle x:Name="PART_DefiningGeometry"

Height="{TemplateBinding ItemActualHeight}"

Width="{TemplateBinding ItemActualWidth}"

Fill="{Binding DataItem.PopulationColor}" />

<Canvas.RenderTransform>

<ScaleTransform x:Name="PART_AnimationTransform" ScaleY="0" />

</Canvas.RenderTransform>

</Canvas>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

<Style x:Key="CustomLabelStyle" TargetType="telerik:SeriesItemLabel">

<Setter Property="HorizontalContentAlignment" Value="Center" />

<Setter Property="Padding" Value="2,0" />

<Setter Property="IsHitTestVisible" Value="False"/>

<Setter Property="Template" >

<Setter.Value>

<ControlTemplate TargetType="telerik:SeriesItemLabel">

<Canvas x:Name="PART_MainContainer">

<Path

Visibility="{TemplateBinding ConnectorVisibility}"

Style="{TemplateBinding ConnectorStyle}"

Stroke="{TemplateBinding Stroke}"

StrokeThickness="{TemplateBinding StrokeThickness}">

<Path.Data>

<PathGeometry >

<PathGeometry.Figures>

<PathFigure x:Name="PART_Connector">

<PathFigure.Segments>

<PolyLineSegment />

</PathFigure.Segments>

</PathFigure>

</PathGeometry.Figures>

</PathGeometry>

</Path.Data>

</Path>

<Border x:Name="PART_TextContainer"

Style="{TemplateBinding LabelStyle}"

BorderBrush="Transparent"

Background="Transparent">

<TextBlock Foreground="Black"

TextAlignment="{TemplateBinding HorizontalContentAlignment}"

Margin="0"

Text="{TemplateBinding Content}" />

</Border>

</Canvas>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

</UserControl.Resources>

<Grid Height="500" Width="640">

<Grid.RowDefinitions>

<RowDefinition Height="*" />

<RowDefinition Height="Auto" />

</Grid.RowDefinitions>

<telerik:RadChart x:Name="RadChart1" ItemsSource="{Binding CostIndexData}" Height="250">

<telerik:RadChart.SeriesMappings>

<telerik:SeriesMapping>

<telerik:SeriesMapping.SeriesDefinition>

<telerik:BarSeriesDefinition ItemStyle="{StaticResource CustomStyle}"

SeriesItemLabelStyle="{StaticResource CustomLabelStyle}"

ItemLabelFormat="#Y{0.00}">

<telerik:BarSeriesDefinition.LabelSettings>

<telerik:BarLabelSettings LabelDisplayMode="MidPoint" Distance="0" />

</telerik:BarSeriesDefinition.LabelSettings>

</telerik:BarSeriesDefinition>

</telerik:SeriesMapping.SeriesDefinition>

<telerik:ItemMapping FieldName="Data.CostIndex" DataPointMember="YValue" />

<telerik:ItemMapping FieldName="Data.ServiceCategory" DataPointMember="XCategory" />

</telerik:SeriesMapping>

</telerik:RadChart.SeriesMappings>

<telerik:RadChart.DefaultView>

<telerik:ChartDefaultView>

<telerik:ChartDefaultView.ChartTitle>

<telerik:ChartTitle Content="Cost Index Summary, by Service Category" />

</telerik:ChartDefaultView.ChartTitle>

<telerik:ChartDefaultView.ChartLegend>

<telerik:ChartLegend Visibility="Collapsed" />

</telerik:ChartDefaultView.ChartLegend>

<telerik:ChartDefaultView.ChartArea>

<telerik:ChartArea ItemClick="ChartArea_ItemClick">

<telerik:ChartArea.AxisX>

<telerik:AxisX MajorTicksVisibility="Collapsed" />

</telerik:ChartArea.AxisX>

<telerik:ChartArea.AxisY>

<telerik:AxisY AutoRange="False" MinValue="0" MaxValue="2" Step=".2"

MinorTicksVisibility="Collapsed"

MajorTicksVisibility="Collapsed" />

</telerik:ChartArea.AxisY>

</telerik:ChartArea>

</telerik:ChartDefaultView.ChartArea>

</telerik:ChartDefaultView>

</telerik:RadChart.DefaultView>

</telerik:RadChart>

<telerik:RadGridView x:Name="RadGridView1" Margin="0"

RowIndicatorVisibility="Collapsed" IsReadOnly="True"

Width="550" MinHeight="200" MaxHeight="200"

AutoGenerateColumns="False" CanUserFreezeColumns="False"

CanUserResizeColumns="False"

Grid.Row="1">

<telerik:RadGridView.Columns>

<telerik:GridViewImageColumn Header="Actual Encounters" DataMemberBinding="{Binding ActualEncounters}" />

<telerik:GridViewDataColumn Header="Peer Encounters" DataMemberBinding="{Binding PeerEncounters}" />

<telerik:GridViewDataColumn Header="Actual Cost/Episode" DataMemberBinding="{Binding ActualCostPerEpisode}" />

<telerik:GridViewDataColumn Header="Peer Cost/Episode" DataMemberBinding="{Binding PeerCostPerEpisode}" />

<telerik:GridViewDataColumn Header="Cost/Episode Index" DataMemberBinding="{Binding CostPerEpisodeIndex}" />

<telerik:GridViewDataColumn Header="Actual Total Cost" DataMemberBinding="{Binding ActualTotalCost}" />

</telerik:RadGridView.Columns>

</telerik:RadGridView>

</Grid>

</UserControl>

Any idea how I can populate my gridview for this scenario?

Thanks!

5 Answers, 1 is accepted

answered on 07 Jun 2011, 06:33 PM

I have created a new project and have gotten this up and running again, but still the grid never updates with my data. I can see that a row does get added to the grid, but my data is not in it. If I set 'autogeneratecolumns' = True a row gets added with only one column called "Data" and the value displayed in the column is MyCompany.Controls.Silverlight.CostAndUtilizationSummaryMeasuresData. So I do believe that the control is updating, it just doesn't know how to handle the data. Here is where I am binding:

Dim lRecord As Dictionary(Of String, String) = e.Result

Dim lDatalist As New List(Of CostAndUtilizationSummaryMeasuresData)

lDatalist.Add(New CostAndUtilizationSummaryMeasuresData(lRecord("ServiceCategory"),

lRecord("ActualEncounters"),

lRecord("PeerEncounters"),

lrecord("ActualCostPerEpisode"),

lrecord("PeerCostPerEpisode"),

lrecord("CostPerEpisodeIndex"),

lRecord("ActualTotalCost")))

Dim lModelList As New List(Of CostAndUtilizationSummaryMeasuresDataViewModel)

For Each lDataItem As CostAndUtilizationSummaryMeasuresData In lDatalist

lModelList.Add(New CostAndUtilizationSummaryMeasuresDataViewModel(lDataItem))

Next

RadGridView1.ItemsSource = Nothing

RadGridView1.ItemsSource = lModelList

End Sub

How do bind the GridView to a generic list? If I bind directly to e.result it does pull the data, but it gives a row for each name/value pair(columns equal key and value) instead of creating a column for each name/value pair which is what I need.

Thanks!!