Tag Archives: wpf toolkit

WPF Toolkit Chart – Custom tooltip on LineSeries charts

NET%20LogoA 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>