xilex
Posts: 9
Joined: Thu Dec 30, 2021 11:48 pm

Timeline: how to prevent tooltip from appearing outside viewport

Hello, my example code is here: https://jsfiddle.net/rs1j7tdy/2/

I am using the tooltip with outside: true and useHTML: true with custom pointFormat. The chart itself more or less takes up the entire vertical space of the screen. The tooltips at the top show up properly, and adjust positioning to appear within the screen. The tooltips at the bottom, however, such as the last one, Nov 1998, always show part of the tooltip off screen, sometimes up to half the tooltip. Is there a way to change this behavior? Thank you.
xilex
Posts: 9
Joined: Thu Dec 30, 2021 11:48 pm

Re: Timeline: how to prevent tooltip from appearing outside viewport

I found the problem was because I had a large image that was flowing out of the div, so all the tooltip position calculations were off. I fixed up the way the image is displayed, and tweaked https://jsfiddle.net/BlackLabel/d5qem72x/ to have it positioned correctly.
mateusz.b
Posts: 2006
Joined: Tue Jul 13, 2021 11:34 am

Re: Timeline: how to prevent tooltip from appearing outside viewport

Hi xilex,

Glad to hear you have figured it out and thanks for sharing what was the problem! In case of any further questions feel free to contact us again.

Regards!
Mateusz Bernacik
Highcharts Developer

Return to “Highcharts Usage”