Vaadin charts tooltip overflow

Hi,

I’m currently evaluating Vaadin Charts. One restriction I encountered is that tooltips are confined to the chart area (since they are svg elements). Are there any workarounds to show tooltips that are larger than the actual chart?

Hi,

The Tooltip class has the property useHTML, which makes it use HTML to render instead of SVG. Maybe you can get somewhere with that?

Hope this helps,
Olli

Hi Olli,

as far as I can tell useHTML merely allows me to use html to define the content of the tooltip, it does not change the fact that the tooltip is made up of svg elements and it is therefore confined to the chart area.

This limitation is my experience also.

Hi Patrick,

I did a small test adding the following css to my app theme:

.vaadin-chart > svg{ overflow:visible; } .highcharts-container{ overflow:visible !important; } And it seems to be working as in the attached example. I haven’t seen any side effect of having this css rules so far but I didn’t have time to test a lot either.

Hope this helps,

Guille
28202.png