Skip to content

tickFormat receives unexpected normalized values after update to 4.0.1-alpha.0Β #1975

@alekcey0211

Description

@alekcey0211

After updating @visx/xychart to version 4.0.1-alpha.0, the behavior of tickFormat has changed.
tickFormat now receives unexpected intermediate values (0 β†’ 1 range) instead of only the original x values from my dataset.

This breaks formatting logic and seems like a regression compared to previous versions.

Use a basic example based on the official documentation:

const data1 = [
  { x: "2020-01-01", y: 50 },
  { x: "2020-01-02", y: 10 },
  { x: "2020-01-03", y: 20 },
];

const data2 = [
  { x: "2020-01-01", y: 30 },
  { x: "2020-01-02", y: 40 },
  { x: "2020-01-03", y: 80 },
];

const accessors = {
  xAccessor: (d: SeriesValue) => d.x,
  yAccessor: (d: SeriesValue) => d.y,
};

<XYChart height={300} xScale={{ type: "band" }} yScale={{ type: "linear" }}>
  <AnimatedAxis
    orientation="bottom"
    tickFormat={(value: string) => {
      console.log(value);
      return value;
    }}
  />
  <AnimatedGrid columns={false} numTicks={4} />
  <AnimatedLineSeries dataKey="Line 1" data={data1} {...accessors} />
  <AnimatedLineSeries dataKey="Line 2" data={data2} {...accessors} />
</XYChart>

Actual Behavior

Console output:

0
0.1
0.2
0.3
0.4
0.5
0.6
0.7
0.8
0.9
1
2020-01-01
2020-01-02
2020-01-03

tickFormat receives normalized numeric values (0 β†’ 1) that do not correspond to axis domain values.


Expected Behavior

tickFormat should receive only the actual x values from the dataset:

2020-01-01
2020-01-02
2020-01-03

This was the behavior prior to version 4.0.1-alpha.0.


Environment

@visx/xychart: 4.0.1-alpha.0

React: 18.3.1

Browser: Chrome

OS: Mac

Metadata

Metadata

Assignees

Type

Projects

No projects

Relationships

None yet

Development

No branches or pull requests

Issue actions