I was trying to think of ways of positioning the tooltip in a more convenient place when in line charts, as the default positioning is always 50%; depending on the actual chart, this may not be ideal:
(the line chart/tooltip interaction in Firefox also has some rendering problems, as you can see chart segments to the right of the tooltip render "over" the tooltip, but that is a separate issue!)
In this PR, I suggest to use calc() to calculate the maximum of --start and --end variables, and multiply it by 100%, to change the tooltip position so that it always renders above the line:
It might need a bit more padding, as you can see the "tail" of the tooltip is just slightly below the line segment still, but, I believe it is an improvement.
Also, using var()'s second parameter, the fallback parameter, we can fall back to using a value of 0.5 * 100% = 50%, which is the default (current) value today. In this way, I don't think this change should affect chart types other than line charts.
Thanks for the great library!
I was trying to think of ways of positioning the tooltip in a more convenient place when in line charts, as the default positioning is always 50%; depending on the actual chart, this may not be ideal:
(the line chart/tooltip interaction in Firefox also has some rendering problems, as you can see chart segments to the right of the tooltip render "over" the tooltip, but that is a separate issue!)
In this PR, I suggest to use
calc()
to calculate the maximum of--start
and--end
variables, and multiply it by100%
, to change the tooltip position so that it always renders above the line:It might need a bit more padding, as you can see the "tail" of the tooltip is just slightly below the line segment still, but, I believe it is an improvement.
Also, using
var()
's second parameter, the fallback parameter, we can fall back to using a value of0.5 * 100%
=50%
, which is the default (current) value today. In this way, I don't think this change should affect chart types other than line charts.