-
Notifications
You must be signed in to change notification settings - Fork 11.9k
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
[FEATURE] Add more intelligent xAlign for tooltip #5728
Comments
Please relate if this feature could be useful - I can contribute and make a PR, but I want to be sure I am not the only guy who finds this feature reasonable or at least not a fiddle-faddle :) |
You are not the only guy. The way how modules are written is not flexible at all. There is number of scoped functions that cannot be used or overriden from outside. This is fast (not bullet-proof) monkey-patch to override two-line function
|
Currently
xAlign
property for tooltip has three different variables: left, right and center. But such realisation is not very flexible and gives little control on tooltip allignment.Current Behavior
Currently with this config I can make tooltip to align automatically:
tooltips: { mode: 'index', intersect: false, yAlign: 'center', ... }
But when tooltip as xAlign-ed to center it covers the current data points beneath it so they are not visible. It's not very handy, because I want to see the points position that I have selected.
Current options for
xAlign
- left and right stick the position of the tooltip, but it becomes cropped if hovered on left- or right-most parts of the canvas.Expected Behavior
It would be better if tooltip had more adjustable alignment facility so that selected points were not hidden by the tooltip and were positioned whether to right or to left from the selected data points if area of chart allows it.
Possible Solution
The more or less working solution I've found so far is this on SO . But those guys suggest total copy-paste from chart.js tooltip source and monkey-patch it through plugin system, which needs a lot code duplication - only to alter the
determineAlignment
function I need to fetch all tooltip's code.Possible solutions can be
determineAlignment
function with chart.js options APIxAlign
variants likefloatLeft
andfloatRight
to suggest the tooltip on how to align oneself, and if it's not possible to align left or rigth without cropping it - than alignment goes on auto mode (as it's now)Any comments are valueable, thank you!
The text was updated successfully, but these errors were encountered: