Skip to content

Scatter and Bar components have misaligned X coordinates in ComposedChart #6115

Description

@dcgauld

What is the current behavior?

I'm trying to align custom <Scatter> shapes to their respective <Bar> shapes using <ComposedChart>, however I'm seeing slight differences between their X coordinates.

I had assumed that using props.cx within the <Scatter> shape alongside a predictable bar size would allow me to calculate the X coordinate of the <Bar> so that they align, however the values come out slightly different (see the demo's console output). I can't figure out a way around this.

Is this expected? Or am I trying to do something silly here?

What is the expected behavior?

The X coordinate of a <Scatter> component can be calculated to match the associated <Bar> component.

Please provide a demo of the problem in a sandbox

https://stackblitz.com/edit/react-pna3dnxs?file=src%2FExample.tsx

Which versions of Recharts, and which browser / OS are affected by this issue? Did this work in previous versions of Recharts?

All versions/browsers.

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugGeneral bug label

    Type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions