[BUG] Tooltip hides when update is called

[pantonis]

[BUG] If I am over a slice in pie chart and I tooltip is visible when new data come in and update the chart, tooltip becomes hidden when it should not. I am using 2.7.1

Expected Behavior

Tooltip should not be hidden but instead updated with new values and stay visible.

Current Behavior

[BIf I am over a slice in pie chart and I tooltip is visible when new data come in and update the chart, tooltip becomes hidden or flashing.

Possible Solution

Steps to Reproduce (for bugs)

1. https://jsfiddle.net/pantonis/amgagdmq/19/

Context

This happens on all charts (pies, bars, radar etc..)

Environment

• Chart.js version: 2.7.1
• Browser name and version: Chrome
• Link to your project: N/A

[etimberg]

This is a result of #4840

I think the current behaviour is more correct, in my opinion, because it prevents a number of other issues. @benmccann @simonbrunel thoughts?

[pantonis]

The tooltip is flashing and is very very ugly.Very bad UX. I have seen several other libraries which just update the tooltip value. No hide and show again.I think desired behavior is straightforward. If the tooltip is visible it must update the new value and stay visible without hide and show with the new value.

[simonbrunel]

I think I agree with @pantonis, though I would hide the tooltip if the associated data/datasets are not anymore available (no dangling tooltip). We should add a way to programmatically hide the tooltip (maybe that's already the case), then users can easily hide tooltip after an update if desired. Currently, it doesn't seem possible (in a clean way) to prevent the tooltip to hide, which certainly goes against some UI/UX.

[pantonis]

@simonbrunel In a scenario where data are updated every 1 second and the tooltip is visible because the user wants to see a specific value shown on tooltip why would you hide it if the data/dataset are not available anymore? New data come in

[simonbrunel]

Agree, we could cache the last mouse/tap position, so when calling chart.update():

if tooltip visible {
  if data intersect {
    update toolip
  } else {
    hide tooltip
  }
}

[pantonis]

@simonbrunel kudos to you, you are my man. that is exactly what I mean!!

[pantonis]

Is there any timeline on when this is gonna be fixed?

[Evertvdw]

This is also an issue when having realtime charts, I add data to a chart every half a second and update te chart. If you then hover a point the tooltip dissappears every .5 seconds, which is really annoying as you hardly get a look at the tooltip.

Is there a current workaround to prevent this from happening? I'm looking at a plugin which redraws the tooltip after the update but no luck so far:

afterUpdate: function(chart) {
        if (chart.tooltip._active) {
            console.log('Should redraw tooltip');
            chart.tooltip.draw()
        }
}

Strange thing is that the tooltip._active object still contains the element on which the tooltip needs to be displayed after an update but it does not show. Can I do it manually somehow?

Thanks!

[yashcr07]

In my case the update doesn't get called when the mouse moves out of the chart, which doesn't set the tooltipModel.opacity to 0, so my tooltip continues to be displayed until i again hover on the chart and move my mouse out slowly.

This happenes only when i move the mouse pointer fast enough.

I'm using the custom tooltip option.

I couldn't reproduce this bug accurately as it only happens on the initial hover here. Just move the mouse really fast over the chart and you'll manage to get a tooltip which doesn't auto hide. if you fail to get the result, just reload the output window and try again.