Disabling tooltip without disabling interactivity

[ilyabo]

Is your feature request related to a problem? Please describe.
I would like to have more control over how exactly the tooltips are rendered. For instance, I would like to render them in a portal so that they are not cut by the container or use custom positioning logic. Right now it doesn't seem to be possible without redefining item components e.g. barItemComponent which is quite a limitation. It is possible to disable interactivity but that also disables other interactive features e.g. the crosshair and the onMouse… event handlers are not called at all.

Describe the solution you'd like
There should be a property isTooltipEnabled which would disable the tooltip when passed false without disabling the onMouse… event handlers. Alternatively, passing null to the tooltip prop could also disable tooltip.

Additional context
Large tooltip in a small chart is cut because it's not rendered in a portal in a container which needs to use overflow: hidden or overflow: scroll

[tkonopka]

Hi @ilyabo. You mentioned passing null to the tooltip to disable it. A similar approach could be to render an empty tooltip with tooltip={() => (<></>)}

[ilyabo]

Yes, thanks! I've actually discovered this approach too now and it works for me at least as a workaround. Does it still mean though that some resources are spent on rendering/positioning or can this be neglected? In any case, I think accepting null or false and documenting it would be more straightforward and helpful for the users of the API.

[ilyabo]

Also, offering an option to render the tooltip in a portal would be very helpful I think. Something like tooltipUsePortal which could take a DOM node to render to and default to document.body if just true is passed

[ilyabo]

Noticed that onMouse… events in the Line chart only work when enableSlices is false. That's unfortunate, because we need to use the slices mode and customize the tooltip. Is there a way to circumvent this limitation?

[tkonopka]

The line chart is due an update in #1932. This could be a topic to keep an eye on.

[ilyabo]

I started a related discussion here: #2044

[vikrantsingh47]

@tkonopka not related to this topic, but there are no responses to opened issues recently, is this project actively maintained.

[plouc]

@vikrantsingh47, actively, not really lately, it depends on my other constraints (job, family, ...)

[stale]

This issue has been automatically marked as stale. If this issue is still affecting you, please leave any comment (for example, "bump"), and we'll keep it open. We are sorry that we haven't been able to prioritize it yet. If you have any new additional information, please include it with your comment!

[stale]

Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please create a new issue with up-to-date information. Thank you!

[cx-camilo-rivera]

Another way you could disable tooltips for the bar charts without disabling interactivity is by passing a custom bar to the barComponent prop.