Reduce flicker by continuing to display for a short while when no longer hovering

[benatkin]

In the examples I noticed that when moving the mouse over a graph with a lot of small hoverable areas, the tooltip would rapidly come and go. It would be nice to have an option to make it keep displaying for a short while when hovering only a few pixels outside the area, and use that in the demos.

For instance when you go between the bars in the bar chart in the demo the tooltip comes and goes.

An example of similar behavior is when using a menu with submenus.

[domoritz]

Can you send a pull request?

[benatkin]

I'll try. I was gauging interest as to whether others would think it would be worth the complexity it might add. Thanks.

[domoritz]

I'll have to see how complex it is to judge whether it's worth the complexity.

[benatkin]

Makes sense. I have a couple approaches I'm thinking of trying. I'll try to minimize the complexity.

[benatkin]

I'm thinking of tracking the anchor of the last shown tooltip, if it isn't already tracked, and keeping the tooltip visible until the mouse moves a configurable distance from the last anchor, and also having a timeout after which it hides.

[domoritz]

Is there a simpler way with just CSS and transitions?

[suyash5053]

The debouncing method looks acceptable to me since implementing a slight delay of 200-300 ms (variable) can be a good way. I can try to implement this if prompted.

[domoritz]

Go ahead.

[nicolaskruchten]

I'm a huge fan of the slight-delay approach. This flicker mostly annoys me when moving my cursor across a bunch of bars that have a 1px gap between them and I'm pretty sure this would address it!

[joelostblom]

Maybe the slight delay would also somewhat alleviate vega/vega-lite#6851? Sometimes I hit the one pixel that makes the tooltip show, but it disappears directly; having a delay would at least make it stay there a short while.