elastic-charts
elastic-charts copied to clipboard
Have a displayValueSettings option to dynamically set the label's offset based on the label box
Is your feature request related to a problem? Please describe.
Dealing with horizontal offset in horizontal bar charts can be challenging with different value label box sizes: a single offsetX
size won't fits all possible values.
While for vertical placement it is possible to build a sensible positional heuristic based on the fontSize
parameter, with the horizontal version it is more tricky as it's not known the maximum value at init time.
Describe the solution you'd like
It would be nice to have both offsetX
and offsetY
be of type function, so that the developer could return a dynamical value for each value label based on the valueBox to precisely position the label.
Stretch goal: it would be nice to have also an additional overrideChartMargins
option, which automagically handles "outside" labels by overriding theme margins for the particular direction.
Describe alternatives you've considered
Another approach would be to provide a fixed outside
behaviour as in #784 and let the develop build offset
tweaks on top of it.
As for the additional overrideChartMargins
option alternative, for horizontal chart, I think there's nothing I can think of for it.
Additional context
This feature would make it possible to provide the correct behaviour for a outside
label positioning as shown in the GIF above.
A possible solution to this could be also #856
I believe this would also resolve another issue mentioned internally where the bar values are hidden when constrained to the bar geometry regardless of the offsetY
.
Lens offers an option for the values to be inside or outside of the bar. There is a request, see below, to allow showing the values inside whenever possible and outside otherwise.
See demo story here