Am chart v4 Tooltip issue

Question

I am using XY chart for line chart in amchart v4 , I am phasing issue in tooltip, I have customize tooltip text as html , but when mouse hover one line show all line tooltip, I want only selected line tooltip not for all lines, please help

Following image describes the issue that I'm facing:

Answer 1

I'm afraid that while the Chart Cursor (XYCursor) is enabled, there's no way to lock down onto only one series' tooltip while multiple series' tooltips are defined. Even if you define a tooltip on their bullets and give the bullets a new tooltip object (because by default they use their series' tooltip), Chart Cursor will still trigger the bullets' tooltips. I'll see if there is a way to opt-in/out of the force hover behavior of Chart Cursor, but at the moment it seems that is not the case.

If you need the Chart Cursor, what you can do is only assign tooltipHTML to just one series. Especially since it seems all of your tooltips are showing the exact same data.

It seems like you're aware of the following already but I'll mention these just in case. You can find an example of single series tooltip in our guide on HTML content for tooltips, "Adding interactive elements". And here's the CodePen demo it shows:

https://codepen.io/team/amcharts/pen/Wgmzga

If you can go without Chart Cursor, that opens up the doors for tooltips appearing based on the series you hover over.

Here's an example that starts with Chart Cursor and just a tooltip on one series, then if you click the button on the top right and wait a second, it'll kill the Chart Cursor, enable bullets with tooltipHTML set on them instead:

https://codepen.io/team/amcharts/pen/371ab4d22e7a9c7dffeca36a3c54fe6a

Answer 2

This should make one tooltip to rule them all:

https://www.amcharts.com/docs/v4/reference/xycursor/#maxTooltipDistance_property

chart.cursor = new am4charts.XYCursor() chart.cursor.maxTooltipDistance = -1