Skip to content

This example demonstrates how to show tooltip on Xamarin.Forms Chart axis label click

Notifications You must be signed in to change notification settings

SyncfusionExamples/How-to-show-tooltip-on-Xamarin.Forms-Chart-axis-label-click

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

11 Commits
 
 
 
 
 
 

Repository files navigation

How to show tooltip on Xamarin.Forms Chart axis label click?

This example demonstrates how to programmatically show the tooltip when tapping on the chart axis label.

You can show the tooltip programmatically with the help of axis LabelClicked event and Show method of ChartTooltipBehavior as per the following code snippet.

[XAML]

<chart:SfChart.PrimaryAxis> 
       <chart:CategoryAxis LabelClicked ="CategoryAxis_LabelClicked" /> 
</chart:SfChart.PrimaryAxis>  
 
<chart:SfChart.Series>
      <chart:ColumnSeries EnableTooltip="True" ItemsSource="{Binding ColumnData}" XBindingPath="XValue" YBindingPath="YValue" />
</chart:SfChart.Series>
                
<chart:SfChart.ChartBehaviors>
    <chart:ChartTooltipBehavior x:Name="tooltip"/>
</chart:SfChart.ChartBehaviors>

C#

private void CategoryAxis_LabelClicked(object sender, LabelClickedEventArgs e)
{
            var datapoints = series.GetDataPoints(e.Position, e.Position, chart.SeriesBounds.Top, chart.SeriesBounds.Bottom);
 
            if (datapoints.Count > 0)
            {
                ChartModel data = datapoints[0] as ChartModel;
                float xPoint = (float)chart.ValueToPoint(chart.PrimaryAxis, e.Position);
                float yPoint = (float)chart.ValueToPoint(chart.SecondaryAxis, data.YValue);
                tooltip.Show(xPoint, yPoint, true);
            }
}

Note: Show method is available for Android and iOS platforms only. It will not work for UWP platform.

Output:

Show tooltip on Xamarin.Forms Chart axis label click

KB article - How to show tooltip on Xamarin.Forms Chart axis label click?

Troubleshooting

Path too long exception

If you are facing path too long exception when building this example project, close Visual Studio and rename the repository to short and build the project.

About

This example demonstrates how to show tooltip on Xamarin.Forms Chart axis label click

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 4

  •  
  •  
  •  
  •  

Languages