style attributes not passed to custom legends on axis
Hello everyone,
i am trying to achieve a custom legend implementation on the y-axis for a certain chart i am trying to implement. However, when i send in custom tags (text, textSpan) using the tickFormat option, i don't see them on the charts.
on digging further, i realised that the out of the box ticks are attributed with multiple props such as transform, fill that define their styling, position and alignment. However, these props are not passed to the custom tick component i pass, because of the following line this particular check in the source code.
const shouldAddProps = labelNode && typeof labelNode.type !== 'string';
Just wanted to check if there's a way to get around this condition ? I looked up in the docs but couldn't find anything relevant.
PS : Trying to implement a chart where there are two Y AXIS, both with left orientation, but the labels for each being stacked on top of each other. Some pointers would be really appreciated if this is already done before.
Figured a way around this, Hopefully this might help others as well (Still not sure about why not pass the textProps directly to the tickFormat function).
You can pass a function to the tickFormat param, which in turn returns the component you want to render as the custom legend. This component will receive all the textProps in it's constructor.
tickFormat={val => <YAxisLegends value={val} />}