We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Shared tooltip for multiple series chart

Thread ID:

Created:

Updated:

Platform:

Replies:

128347 Jan 16,2017 03:32 PM UTC Jan 17,2017 02:05 PM UTC WPF 6
loading
Tags: Chart
Maurizio Taddei
Asked On January 16, 2017 03:32 PM UTC

Hi,

I'm trying to replicate a chart that I built using Highcharts.JS (please see picture in attached file). 

The problem I'm having is that I cannot find a way to display "shared" tooltips i.e. a tooltip that will display the Y values of two/more series for a given X value (in my case a date) as illustrated in the attached. 

In Highcharts, this is achievable by setting the tooltip to "Shared" and then writing a custom formatter, via which it is possible to access data points for all the series.

Is this possible?

Thanks in advance!

Regards,
Maurizio

Attachment: shared_tooltip_ef258519.rar

Maurizio Taddei
Replied On January 17, 2017 08:47 AM UTC

Hi,

I'm trying to replicate a chart that I built using Highcharts.JS (please see picture in attached file). 

The problem I'm having is that I cannot find a way to display "shared" tooltips i.e. a tooltip that will display the Y values of two/more series for a given X value (in my case a date) as illustrated in the attached. 

In Highcharts, this is achievable by setting the tooltip to "Shared" and then writing a custom formatter, via which it is possible to access data points for all the series.

Is this possible?

Thanks in advance!

Regards,
Maurizio

Attachment: shared_tooltip_ef258519.rar

Apologies, this post should be under "sfChart"

Santhiya Arulsamy [Syncfusion]
Replied On January 17, 2017 10:32 AM UTC

Hi Maurizio,

Thanks for contacting Syncfusion support.

We can achieve your requirement by applying the TooltipTemplate in the Chart series. We have prepared the sample based on your requirement. Please find the sample from the following location.

Sample: Tooltip

Please refer to the following UG for further information.

https://help.syncfusion.com/wpf/sfchart/interactive-features#customizing-the-tooltip 

Thanks,
Santhiya A 


Maurizio Taddei
Replied On January 17, 2017 10:47 AM UTC

Hi Santhiya,

Thanks for the response. This answers part of my question, however, what I need is to display "y value" for both series1 and series2 in the same tooltip.

So tooltip will read something like:

Sat 01 June '17
Series1: 17
Series2: 15

Thanks,
Maurizio

Santhiya Arulsamy [Syncfusion]
Replied On January 17, 2017 12:07 PM UTC

Hi Maurizio,

Thanks for the update.

We can achieve your requirement by binding the series item values in the template as like in the following code sample


 
 
<DataTemplate x:Key="tooltipTempalate"> 
 
<Border BorderThickness="2" BorderBrush="{Binding Interior}" 
CornerRadius="4" Padding="5" Background="White"> 
 
<StackPanel> 
<StackPanel Orientation="Horizontal"> 
<TextBlock Text="XValue : "/> 
<TextBlock Text="{Binding XData,Converter={StaticResource  converter}}"/> 
</StackPanel> 
 
<StackPanel Orientation="Horizontal"> 
<TextBlock Text="Series1 : "/> 
<TextBlock Text="{Binding Item.Value1}"/> 
</StackPanel> 
 
<StackPanel Orientation="Horizontal"> 
<TextBlock Text="Series2 : "/> 
<TextBlock Text="{Binding Item.Value2}"/> 
</StackPanel> 
 
</StackPanel> 
 
</Border> 
 
</DataTemplate> 
 
 
Thanks, 
Santhiya A 


Maurizio Taddei
Replied On January 17, 2017 01:14 PM UTC

Hi Santhiya,

Yes, this is what I need. Please attach the sample code (was not attached in previous post), thanks.

Regards,
Maurizio

Santhiya Arulsamy [Syncfusion]
Replied On January 17, 2017 02:05 PM UTC

Hi Maurizio, 
  
Please find the sample from the following location. 
  
Sample: Tooltip_(2)
 
  
Thanks, 
Santhiya A 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;