A simple code example about how easily customize your charts tooltip. In this example I just display the value of the X and Y axis in the tooltip.
<chartingToolkit:Chart Title="Demo Chart"> <chartingToolkit:LineSeries DependentValuePath="Value" IndependentValuePath="Key" ItemsSource="{Binding}" IsSelectionEnabled="True"> <chartingToolkit:LineSeries.DataPointStyle> <Style TargetType="chartingToolkit:DataPoint"> <Setter Property="Background" Value="#0077CC" /> <Setter Property="BorderBrush" Value="White"/> <Setter Property="BorderThickness" Value="2"/> <Setter Property="IsTabStop" Value="False"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="chartingToolkit:LineDataPoint"> <Grid x:Name="Root" Opacity="1"> <ToolTipService.ToolTip> <StackPanel Margin="2,2,2,2"> <ContentControl Content="{TemplateBinding IndependentValue}" ContentStringFormat="Date : {0}"/> <ContentControl Content="{TemplateBinding DependentValue}" ContentStringFormat="Count : {0:###,###,###}"/> </StackPanel> </ToolTipService.ToolTip> <Ellipse StrokeThickness="{TemplateBinding BorderThickness}" Stroke="{TemplateBinding BorderBrush}" Fill="{TemplateBinding Background}"/> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> </chartingToolkit:LineSeries.DataPointStyle> </chartingToolkit:LineSeries> </chartingToolkit:Chart>
Thank, Emmanuel. You post was very insightful. I was attempting to do a little more by building upon the snippet above but ran into some difficulty. I have posted the question in the C# forum at:
http://social.msdn.microsoft.com/Forums/vstudio/en-US/71de6f54-4fd5-435c-92ee-63360a3b29fd/how-is-code-behind-used-to-set-custom-tooltip-for-lineseries?forum=wpf#71de6f54-4fd5-435c-92ee-63360a3b29fd
Let me know if you have some advice.
Thanks for the post, Emmanuel. I implemented binding with mixed results. See results at: http://social.msdn.microsoft.com/Forums/vstudio/en-US/71de6f54-4fd5-435c-92ee-63360a3b29fd/how-is-code-behind-used-to-set-custom-tooltip-for-lineseries?forum=wpf
I have another question. I can get the code behind method for binding the data to work in the element. However, I cannot get it to work in the element. I get an error in the code behind saying “TextBlockChartFirstPoint” does not exist in the current context. Where should I call this method in the XAML for the data point’s tooltip to contain this formatted string and for the solution to compile?
Hi Emmanuel. I eventually managed to bind the contents of TextBlock elements to LineDataPoint ToolTip elements. Unfortunately, the code only works in SilverLight applications but not in WPF applications where the ToolTip elements are blank. Do you have any pointers for me to consider? The snippets of code are presented at: http://social.msdn.microsoft.com/Forums/vstudio/en-US/f8a6d2a7-5aef-43f2-a2c5-3d2b6c4fa144/binding-external-textblock-content-to-chart-contentcontrol-in-wpf?forum=wpf
I appreciate your help.
Thanks a Lot