Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Tooltip in 'x' mode doesn't always show all labels on the same X axis value #7766

Closed
A-STAR opened this issue Sep 6, 2020 · 7 comments · Fixed by #8781
Closed

Tooltip in 'x' mode doesn't always show all labels on the same X axis value #7766

A-STAR opened this issue Sep 6, 2020 · 7 comments · Fixed by #8781

Comments

@A-STAR
Copy link

A-STAR commented Sep 6, 2020

Expected Behavior

A tooltip must always show labels for all displayed chart datasets.

Current Behavior

Sometimes all labels don't get displayed in the tooltip.

Label callback doesn't get invoked for some chart datasets that visible on chart (blue and pink).

Screen Shot 2020-08-26 at 9 38 07 PM

Screen Shot 2020-08-26 at 9 38 27 PM

Screen Shot 2020-08-26 at 9 38 46 PM

Possible Solution

The datasets may get filtered out for tooltip labels callback based on some unknown condition. This should be fixed to always invoke label callback for each of the chart dataset.

Steps to Reproduce

  1. Set a tooltip mode to 'x' and intersect to false
  2. Add a label callback to the tooltip callbacks to render the labels
  3. Hover over the chart at different x points.
  4. label callback sometimes doesn't get triggered for certain datasets at different x points so the labels don't get rendered to the tooltip

Context

User should be able to see all dataset labels hovering at any chart x.

Environment

  • Chart.js version: 2.9.20
  • Browser name and version: Chrome 84.0.4147.135 (Official Build) (64-bit)
@kurkle
Copy link
Member

kurkle commented Sep 6, 2020

Can you try with v3.0.0-beta?

@A-STAR
Copy link
Author

A-STAR commented Sep 7, 2020

@kurkle just checked, sorry there're too much of breaking changes to fix them all just to check

@kurkle
Copy link
Member

kurkle commented Sep 7, 2020

Ok, can you provided an interactive example?

@mrmonroe
Copy link

mrmonroe commented Oct 2, 2020

I have this issue currently with an enterprise solution my dev team is building. I'll work on a reproduction and get back to you guys.

@A-STAR A-STAR changed the title Tooltip in 'x' and mode doesn't always show all labels on the same X axis value Tooltip in 'x' mode doesn't always show all labels on the same X axis value Oct 2, 2020
@Speculative
Copy link

Speculative commented Oct 13, 2020

@kurkle here's a minimal repro on 2.9.3 with no tooltip configuration besides mode: "x": https://jsfiddle.net/fy8gnomz/
I'll try to upgrade this example to 3.0 later to see if it still repros.

Edit: whoops, sorry, this might be a different issue than the OP. For me it's highlighting the wrong corresponding x values.
Edit 2: Actually the tooltip value is correct, it's the hover style being applied to the wrong corresponding datapoint. I'll still try to repro this in 3.0 and open a separate issue if necessary.

@etimberg
Copy link
Member

@Speculative the hover mode is configured independently from the tooltip mode. See https://jsfiddle.net/2qt6dncz/

@thorst
Copy link

thorst commented Dec 9, 2020

https://jsfiddle.net/kqofb5m2/5/ Im having a similar issue, seems to maybe be caused by the mixed bar and line series. I have both hover and tooltips mode set to x.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

6 participants