How to display a tooltip betweeen 2 series point

[mike trausch]

Hi,
I want to display an image/icon/symbol on the line of my highcharts in the middle of 2 marker point (when line is increasing/decreasing) and be able to display a tooltip when hover it.
Is it possible?
See attachment.
Thanks

[kamil.m]

Hi there,

Thank you for contacting us!

I think that in that case, the most optimal solution would be to create a second series with the type of scatter, then add a custom property isCustomTooltip that is later checked in the tooltip.formatter. That way, you can have a different tooltip formatting for this one point, and a different one for the rest of them.

DEMO: https://jsfiddle.net/BlackLabel/m175Lsae/
Tooltip formatter: https://api.highcharts.com/highcharts/tooltip.formatter

Of course, this is just a simple example so feel free to adjust everything to match your criteria.
If you will encounter any problems while implementing it in your project, please do not hesitate to contact us anytime.

Best regards!

[mike trausch]

Hi,
Thanks for response.
But what I want is to have an image/icon/symbol between value 2 and 3, and also between 3 and 4 (by example) on which I can display a tooltip to explain why it's increasing.
Is it posssible?
Thanks

[kamil.m]

By default, the tooltip is a feature that is available on the point itself. So when you mouse over the point, the tooltip is displayed.

If you want to have a point with tooltip between 3 and 4, then you can add that point to the scatter series.

If you would like to create it programatically, then what I could suggest is maybe writing some custom logic, that will automatically create a scatter series with icons that are between your original data points. It won't be hard to implement, but I would need more details like, where a point should be displayed and where it shouldn't.

In short, it is totally possible - just tell me what exactly would you want to have implemented on the chart. Also, you can share your code in an online editor, like JSFiddle, so that I can work directly on your code, instead of giving you some basic examples.

Regards!

[mike trausch]

Hi,
See my attachment with my graph.
I want the possibility to display and image/icon/bitmap on the line between point 2024/205, 2025/2026, 2041/2042 and 2042/2043 to explain why graph is increasing, decreasing.
Thanks

[kamil.m]

To achieve that you can use the exact same solution I offered you before, just add more points with the corresponding x and y values.

Or if you don't want to create new series, just add a point in between them in the existing data set, and use a custom tooltip formatter.
Unfortunately, since you haven't sent the demo I won't be able to prepare a working example of that on your code.