Do you want to request a feature or report a bug?
Feature request
What is the current behavior?
Currently, separate reference lines can be drawn accurately on a BarChart only if the axis it is parallel to is a number axis, as shown in this codesandbox (from this article). However, as mentioned in the comment in the codesandbox, this will not work if the axis parallel to the reference line is a category axis. This is because:
- it draws from the center of one tick to the next if you use categories for the
segment, instead of from the beginning of the bar to the end of the bar, resulting in an offset reference line like this. The goal is to have the reference line across only the "Floating Rate Securities" bar.

- as mentioned in the comment in the codesandbox, even if there were some way to offset the line to be centered correctly, there is no extra category to define where the last
ReferenceLine segment should end (e.g., how do you define the y axis end segment for the reference line for "U.S. High Quality Bonds"?)
What is the expected behavior?
It would be nice to be able to put a ReferenceLine across each bar, maybe by making ReferenceLine a child component of Bar, or maybe by adding the ability to provide a prop to RefererenceLine like segment={{ x: 5, y: 'someExistingCategory' }}, where the line is automatically centered on the y category axis tick and is the same width as the bar (or slightly larger), and at the value specified by x.
Which versions of Recharts, and which browser / OS are affected by this issue? Did this work in previous versions of Recharts?
Using recharts 2.12.7
Do you want to request a feature or report a bug?
Feature request
What is the current behavior?
Currently, separate reference lines can be drawn accurately on a
BarChartonly if the axis it is parallel to is a number axis, as shown in this codesandbox (from this article). However, as mentioned in the comment in the codesandbox, this will not work if the axis parallel to the reference line is a category axis. This is because:segment, instead of from the beginning of the bar to the end of the bar, resulting in an offset reference line like this. The goal is to have the reference line across only the "Floating Rate Securities" bar.ReferenceLinesegmentshould end (e.g., how do you define the y axis end segment for the reference line for "U.S. High Quality Bonds"?)What is the expected behavior?
It would be nice to be able to put a
ReferenceLineacross each bar, maybe by makingReferenceLinea child component ofBar, or maybe by adding the ability to provide a prop toRefererenceLinelikesegment={{ x: 5, y: 'someExistingCategory' }}, where the line is automatically centered on the y category axis tick and is the same width as the bar (or slightly larger), and at the value specified byx.Which versions of Recharts, and which browser / OS are affected by this issue? Did this work in previous versions of Recharts?
Using recharts 2.12.7