Chart View Tooltip . . . ? (Argh!)

[Todd]

I have a simple chart in a c#/wpf/mvvm design.  Currently working on a trial version of the Chart View to see if it'll meet our development requirements, so I'm totally new to Telerik tools.  I'm missing something on how to implement a tooltip for the chart.  I've struggled for a day, and cannot get tooltips to work.  ):

I've defined a tooltip in a datatemplate as follows.  Ultimately, I'll bind the tooltip to an object in the ViewModel, but can't get this statice text to even work for now.
<UserControl.Resources>
  <DataTemplate x:Key="PolicyTooltipTemplate">
    <Grid>
      <StackPanel>
        <TextBlock FontSize="11" Text="Why am I not appearing in the grids tooltip?? ):" />
      </StackPanel>
    </Grid>
  </DataTemplate>
</UserControl.Resources>

In my ChartView Bareries definition I specify the TootipTemplte to use as follows:
<chartView:BarSeries CategoryBinding="Year" TooltipTemplate="{StaticResource PolicyTooltipTemplate}"
    CombineMode="Stack"
    ValueBinding="PrimaryCoverage"
    ItemsSource="{Binding ModelAuditCoverageChartAGL}">
        <chartView:BarSeries.DefaultVisualStyle>
        <Style TargetType="Border">
        <Setter Property="Background" Value="DodgerBlue"/>

The chart display fine, (attached pic), but when I hover over the chart columns, I cannot get any tooltips?  Have I implemented tooltips incorrectly for the ChartView?  Thanks for any help!

Below is my full xaml:

<UserControl
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:xctk="clr-namespace:Xceed.Wpf.Toolkit;assembly=Xceed.Wpf.Toolkit"
xmlns:viewModels="clr-namespace:CmtModeler.WPF.Modules.AccountManagement.ViewModels"
xmlns:telerik="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Chart"
xmlns:chartView="clr-namespace:Telerik.Windows.Controls.ChartView;assembly=Telerik.Windows.Controls.Chart"
x:Class="CmtModeler.WPF.Modules.AccountManagement.Views.AmModelAuditView"
mc:Ignorable="d" VerticalAlignment="Top" HorizontalAlignment="Left"
d:DesignHeight="300" d:DesignWidth="300"
x:Name="ModelAdjustmentView"
d:DataContext="{d:DesignInstance {x:Type viewModels:AmModelAuditViewModel}}">
<UserControl.DataContext>
<viewModels:AmModelAuditViewModel/>
</UserControl.DataContext>
<UserControl.Resources>
<DataTemplate x:Key="PolicyTooltipTemplate">
<Grid>
<StackPanel>
<TextBlock FontSize="11" Text="Why am I not appearing in the grids tooltip?? ):" />
</StackPanel>
</Grid>
</DataTemplate>
</UserControl.Resources>
<xctk:BusyIndicator IsBusy="{Binding IsBusy}" BusyContent="Loading...">
<Grid x:Name="GridOuterShell" >
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<!--Top gird containing models . . .-->
<DockPanel x:Name="DocPanelAuditModels" Grid.Row="0" Grid.Column="0">
<Grid>
<DataGrid x:Name="ModelsCededBoston" ItemsSource="{Binding ModelAudits}" SelectedItem="{Binding SelectedModelAudit}" Style="{StaticResource AccountMaintenanceGridStyle}">
<DataGrid.Columns>
<DataGridTextColumn Binding="{Binding Batch_Id}" Header="Batch Id" Width="200" IsReadOnly="True"/>
<DataGridTextColumn Binding="{Binding Model_Desc}" Header="Model Description" Width="400*" IsReadOnly="True"/>
<DataGridTextColumn Binding="{Binding Coverage_Id}" Header="Coverage Id" Width="200" IsReadOnly="True"/>
<DataGridTextColumn Binding="{Binding User_Id}" Header="User Id" Width="200" IsReadOnly="True"/>
<DataGridTextColumn Binding="{Binding Model_Run_Dt}" Header="Model Run Dt" Width="200" IsReadOnly="True"/>
<DataGridTextColumn Binding="{Binding Engine_Version}" Header="Engine Version" Width="200" IsReadOnly="True"/>
<DataGridTextColumn Binding="{Binding Application_Version}" Header="Application Version" Width="200" IsReadOnly="True"/>
</DataGrid.Columns>
<DataGrid.RowStyle>
<Style TargetType="{x:Type DataGridRow}">
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="DodgerBlue"/>
<Setter Property="Foreground" Value="White"/>
</Trigger>
</Style.Triggers>
</Style>
</DataGrid.RowStyle>
</DataGrid>
</Grid>
</DockPanel>
<!--Chart showingdetals of selectedmodel . . .-->
<DockPanel x:Name="DocPanelAuditModelsDetails" Grid.Row="1" Grid.Column="0">
<telerik:RadCartesianChart x:Name="AuditModelRadChartView" Grid.Row="4" Grid.Column="0" Height ="500" Zoom="0, 0">
<telerik:RadCartesianChart.HorizontalAxis>
<chartView:CategoricalAxis LabelFitMode="Rotate" x:Name="HorizontalAxis" HorizontalAlignment="Stretch"
MajorTickInterval="1"
Title="Year"
LineThickness="2"
LineStroke="Black"
ShowLabels="True"/>
</telerik:RadCartesianChart.HorizontalAxis>
<telerik:RadCartesianChart.VerticalAxis>
<chartView:LinearAxis LabelFormat ="###,##0" />
</telerik:RadCartesianChart.VerticalAxis>
<chartView:BarSeries CategoryBinding="Year" TooltipTemplate="{StaticResource PolicyTooltipTemplate}"
CombineMode="Stack"
ValueBinding="PrimaryCoverage"
ItemsSource="{Binding ModelAuditCoverageChartAGL}">
<chartView:BarSeries.DefaultVisualStyle>
<Style TargetType="Border">
<Setter Property="Background" Value="DodgerBlue"/>
</Style>
</chartView:BarSeries.DefaultVisualStyle>
</chartView:BarSeries>
</telerik:RadCartesianChart>
</DockPanel>
</Grid>
</xctk:BusyIndicator>
</UserControl>

[Todd]

Note:  The tooltip will need to be more than a tooltip showing the chart values.  It'll eventually be a few formatted values from the ViewModel,

[Todd]

Figured it out.  My xaml was missing:


<telerik:RadCartesianChart.Behaviors>
    <chartView:ChartTooltipBehavior />
</telerik:RadCartesianChart.Behaviors>

[Todd]

So, I at least got the tooltip to dsiplay.  Now I've removed the hardcoded tooltip and I'm trying to bind the tooltip to one of the properties in my VM.  I chose "Year" for the tooltip for now, because the chart is binding to, it so I figured I'd use it in this tooltip test.  The binding in the TooltipTemplate DataTemplate seems pretty straight forward; <TextBlock Text="{Binding Year}" />
But my tooltip is a blank tooltip?!

Here's the TooltipTemplate:

<telerik:RadCartesianChart.TooltipTemplate>
  <DataTemplate>
    <Border Background="White" BorderBrush="Black" BorderThickness="1" Padding="5" CornerRadius="3">
    <TextBlock Text="{Binding Year}" />
    </Border>
  </DataTemplate>
</telerik:RadCartesianChart.TooltipTemplate>

[Martin Ivanov]

Hello Tod,

I am happy to hear that you managed to find the chart's tooltip behavior and its template. Note that the template of the tooltip can be defined also per series.

<telerik:BarSeries.ToolTipTemplate>
.........
</telerik:BarSeries.ToolTipTemplate>

About the binding in the template, keep in mind that the DataContext passed in the template is an object that derives from the DataPoint class which contains information of the data point that is under the mouse. Depending on the series, the data point class is slightly different, for example, the data point model used in the categorical series expose additional Category and Value properties. On the other hand the scatter series' data point is missing those properties but it exposes XValue and YValue. However, the DataPoint object provides a property called DataItem that holds the view model behind the data point. You can use this to bind to a property from your view model. Here is an example:

<telerik:RadCartesianChart.TooltipTemplate>
  <DataTemplate>
    <Border Background="White" BorderBrush="Black" BorderThickness="1" Padding="5" CornerRadius="3">
    <TextBlock Text="{Binding DataItem.Year}" />
    </Border>
  </DataTemplate>
</telerik:RadCartesianChart.TooltipTemplate>

Please try this and let me know if it works for you.

Regards,
Martin
Telerik