in src/YAxisLabels.js [277:352]
render() {
// todo: position: 'zero' prop to position along the zero line
const {
width,
yScale,
position,
distance,
labelStyle,
labelClassName,
spacingLeft,
spacingRight,
offset,
} = this.props;
const placement =
this.props.placement || (position === 'left' ? 'before' : 'after');
const className = `rct-chart-value-label rct-chart-value-label-y ${labelClassName}`;
const textAnchor = placement === 'before' ? 'end' : 'start';
const labels = this.props.labels || YAxisLabels.getLabels(this.props);
const transform =
position === 'left'
? `translate(${-spacingLeft}, 0)`
: `translate(${width + spacingRight}, 0)`;
return (
<g
className="rct-chart-value-labels-y"
transform={transform}
aria-hidden="true"
>
{labels.map((label, i) => {
const y = yScale(label.value) + offset;
const x = placement === 'before' ? -distance : distance;
const [onMouseEnter, onMouseMove, onMouseLeave, onClick] = [
'onMouseEnterLabel',
'onMouseMoveLabel',
'onMouseLeaveLabel',
'onMouseClickLabel',
].map(eventName => {
// partially apply this bar's data point as 2nd callback argument
const callback = get(this.props, eventName);
return isFunction(callback)
? bindTrailingArgs(callback, label.value)
: null;
});
const style = defaults(
{ textAnchor },
getValue(labelStyle, { x, y, ...label }, i),
YAxisLabels.defaultProps.labelStyle,
);
return (
<g
key={`x-axis-label-${i}`}
{...{ onMouseEnter, onMouseMove, onMouseLeave, onClick }}
>
{/* <YAxisLabelDebugRect {...{x, y, label, style: getValue(labelStyle, label.text, i)}}/> */}
<MeasuredValueLabel
value={label.value}
{...{
x,
y,
className,
dy: '0.35em',
style,
}}
>
{label.text}
</MeasuredValueLabel>
</g>
);
})}
</g>
);
}