Update niceTicks to enum, add support for nice log and symlog scale ticks by Copilot · Pull Request #7042 · recharts/recharts

Copilot · 2026-02-23T01:28:24Z

Okay so I added couple changes here on my own:

Changed nicecTicks from boolean to enum ('adaptive' | 'snap125') - let me know if you can think of better names
Added support for log and symlog scales
Added guide page and playground
Fixed a bug where ticks were not aligned in composed chart (this wasn't intentional but a happy coincidence, I'll take it)
Updated scale type definition to better match what is actually going on

See https://recharts.github.io/recharts/pr-7042/www/en-US/guide/axisTicks/

Original prompt

This section details on the original issue you should resolve

<issue_title>Clarify niceTicks</issue_title>
<issue_description>Recharts now has three ways of rendering axis ticks:

ticks decided by d3, evenly spaced and not rounded

"nice ticks A" calculated using getFormatStep (defined in getNiceTickValues.ts)

"nice ticks B" calculated using getFormatStepNice (unreleased, scheduled for 3.8)

Recharts sometimes decides to calculate ticks using variant 1 and sometimes variant 2, the conditions for selecting are not at all intuitive (only for numerical axes with linear scales of type "auto" with tickCount > 0 where at least one of the domain definitions contains the keyword "auto", how's that sound? see combineNiceTicks in axisSelectors.ts).

Then just recently we have added variant 3 which is only activated if all of those rules above are true, AND there is niceTicks=true prop set on the axis.

The initial idea was to replace the "nice ticks A" algorithm completely, only use the "B" variant and delete "A" variant for good. Turns out that the old A is sometimes nicer than B! It uses the space more efficiently, at the expense of making some numbers look less rounded. The B on the other hand uses nice rounded numbers, but sometimes wastes space. Depending on user data.

So let's do this:

Keep both A and B nice ticks variants

Come up with some meaningful names ("nice nice ticks" and "nice ticks" don't cut it, A and B is also not great naming)

Swap the niceTicks prop from boolean to an enum

Set the magical selecting algorithm behind "niceTicks=auto" prop (default)

Set the other two A/B using their own props

If that prop is set explicitly then Recharts won't apply the magical selector, it will just calculate nice ticks using the selected algorithm

One of the enum options will also be "none" where Recharts will not attempt any tick niceties

Document what is going on</issue_description>

Comments on the Issue (you are @copilot in this section)
@PavelVanecek @ckifer @MaxGhenis thoughts? @ckifer Sounds good to me, better than what we have going on if we release as-is for sure

Fixes Clarify niceTicks #7040

✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.

codecov · 2026-02-23T14:42:32Z

Bundle Report

Changes will increase total bundle size by 14.06kB (0.28%) ⬆️. This is within the configured threshold ✅

Detailed changes

Bundle name	Size	Change
recharts/bundle-cjs	1.27MB	2.71kB (0.21%) ⬆️
recharts/bundle-es6	1.1MB	2.65kB (0.24%) ⬆️
recharts/bundle-treeshaking-sankey	336.47kB	2.58kB (0.77%) ⬆️
recharts/bundle-treeshaking-polar	439.95kB	967 bytes (0.22%) ⬆️
recharts/bundle-treeshaking-treemap	344.95kB	2.58kB (0.75%) ⬆️
recharts/bundle-treeshaking-sunburst	314.15kB	2.58kB (0.83%) ⬆️

Affected Assets, Files, and Routes:

view changes for bundle: recharts/bundle-treeshaking-treemap

Assets Changed:

Asset Name	Size Change	Total Size	Change (%)
`bundle.js`	2.58kB	344.95kB	0.75%

view changes for bundle: recharts/bundle-treeshaking-polar

Assets Changed:

Asset Name	Size Change	Total Size	Change (%)
`bundle.js`	967 bytes	439.95kB	0.22%

view changes for bundle: recharts/bundle-cjs

Assets Changed:

Asset Name	Size Change	Total Size	Change (%)
`state/selectors/axisSelectors.js`	810 bytes	65.77kB	1.25%
`polar/PolarAngleAxis.js`	1 bytes	12.95kB	0.01%
`polar/PolarRadiusAxis.js`	1 bytes	11.79kB	0.01%
`util/scale/getNiceTickValues.js`	224 bytes	11.74kB	1.95%
`state/selectors/polarAxisSelectors.js`	2 bytes	8.78kB	0.02%
`state/cartesianAxisSlice.js`	1.61kB	8.02kB	25.2% ⚠️
`state/selectors/combiners/combineConfiguredScale.js`	6 bytes	2.47kB	0.24%
`state/selectors/combiners/combineRealScaleType.js`	45 bytes	1.72kB	2.69%
`polar/defaultPolarAngleAxisProps.js`	1 bytes	770 bytes	0.13%
`polar/defaultPolarRadiusAxisProps.js`	1 bytes	663 bytes	0.15%

view changes for bundle: recharts/bundle-treeshaking-sunburst

Assets Changed:

Asset Name	Size Change	Total Size	Change (%)
`bundle.js`	2.58kB	314.15kB	0.83%

view changes for bundle: recharts/bundle-es6

Assets Changed:

Asset Name	Size Change	Total Size	Change (%)
`state/selectors/axisSelectors.js`	756 bytes	55.89kB	1.37%
`polar/PolarAngleAxis.js`	1 bytes	11.51kB	0.01%
`util/scale/getNiceTickValues.js`	227 bytes	10.8kB	2.15%
`polar/PolarRadiusAxis.js`	1 bytes	10.34kB	0.01%
`state/cartesianAxisSlice.js`	1.61kB	7.1kB	29.47% ⚠️
`state/selectors/polarAxisSelectors.js`	2 bytes	7.06kB	0.03%
`state/selectors/combiners/combineConfiguredScale.js`	6 bytes	1.59kB	0.38%
`state/selectors/combiners/combineRealScaleType.js`	45 bytes	872 bytes	5.44% ⚠️
`polar/defaultPolarAngleAxisProps.js`	1 bytes	598 bytes	0.17%
`polar/defaultPolarRadiusAxisProps.js`	1 bytes	489 bytes	0.2%

view changes for bundle: recharts/bundle-treeshaking-sankey

Assets Changed:

Asset Name	Size Change	Total Size	Change (%)
`bundle.js`	2.58kB	336.47kB	0.77%

codecov · 2026-02-23T14:43:07Z

Codecov Report

❌ Patch coverage is 37.79264% with 186 lines in your changes missing coverage. Please review.
✅ Project coverage is 89.80%. Comparing base (758c6d4) to head (f782614).
⚠️ Report is 2 commits behind head on main.

Files with missing lines	Patch %	Lines
...onents/GuideView/AxisTicks/NiceTicksPlayground.tsx	16.34%	87 Missing ⚠️
www/src/components/GuideView/AxisTicks/index.tsx	11.11%	48 Missing ⚠️
...components/GuideView/AxisTicks/CustomAxisTicks.tsx	27.11%	43 Missing ⚠️
src/state/selectors/axisSelectors.ts	77.77%	8 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #7042      +/-   ##
==========================================
- Coverage   90.20%   89.80%   -0.41%     
==========================================
  Files         526      529       +3     
  Lines       39650    39883     +233     
  Branches     5442     5446       +4     
==========================================
+ Hits        35768    35815      +47     
- Misses       3873     4059     +186     
  Partials        9        9

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.

github-actions · 2026-02-23T15:12:29Z

Staging Deployment Details

Website: https://recharts.github.io/recharts/pr-7042/www/
Test Report: https://recharts.github.io/recharts/pr-7042/vr-tests/

These deployments will remain available for 30 days.

To update snapshots: Comment /update-snapshots on this PR to automatically update the baseline screenshots.

src/state/selectors/axisSelectors.ts

PavelVanecek · 2026-02-26T14:33:33Z

...posedChartApiExamples.spec-vr.tsx-snapshots/ComposedChartWithAxisLabels-1-chromium-linux.png

This one I did not mean to touch but the change looks like an improvement for me so I kept it. I couldn't find any related issues.

PavelVanecek · 2026-02-26T14:34:14Z

...omAxisTicks.spec-vr.tsx-snapshots/AxisTicksPlayground-with-symlog-scale-1-chromium-linux.png

Chromium renders different ticks than the other two browsers which is interesting I suppose. At least it's consistent.

github-actions · 2026-02-26T14:56:51Z

Staging Deployment Details

Website: https://recharts.github.io/recharts/pr-7042/www/
Test Report: https://recharts.github.io/recharts/pr-7042/vr-tests/

These deployments will remain available for 30 days.

To update snapshots: Comment /update-snapshots on this PR to automatically update the baseline screenshots.

github-actions · 2026-02-27T12:47:49Z

Staging Deployment Details

Website: https://recharts.github.io/recharts/pr-7042/www/
Test Report: https://recharts.github.io/recharts/pr-7042/vr-tests/

These deployments will remain available for 30 days.

To update snapshots: Comment /update-snapshots on this PR to automatically update the baseline screenshots.

github-actions · 2026-02-28T13:25:25Z

Staging Deployment Details

Website: https://recharts.github.io/recharts/pr-7042/www/
Test Report: https://recharts.github.io/recharts/pr-7042/vr-tests/

These deployments will remain available for 30 days.

To update snapshots: Comment /update-snapshots on this PR to automatically update the baseline screenshots.

…enum Co-authored-by: PavelVanecek <1100170+PavelVanecek@users.noreply.github.com>

…d symlog scales

…or consistency

github-actions · 2026-03-01T15:32:43Z

Staging Deployment Details

Website: https://recharts.github.io/recharts/pr-7042/www/
Test Report: https://recharts.github.io/recharts/pr-7042/vr-tests/

These deployments will remain available for 30 days.

To update snapshots: Comment /update-snapshots on this PR to automatically update the baseline screenshots.

Copilot AI assigned Copilot and PavelVanecek Feb 23, 2026

Copilot started work on behalf of PavelVanecek February 23, 2026 01:28 View session

Copilot finished work on behalf of PavelVanecek February 23, 2026 02:27

ckifer reviewed Feb 24, 2026

View reviewed changes

src/state/selectors/axisSelectors.ts Outdated Show resolved Hide resolved

PavelVanecek added bug General bug label feature request Issues that are feature requests labels Feb 26, 2026

PavelVanecek changed the title ~~[WIP] Clarify behavior of niceTicks in Recharts~~ Update niceTicks to enum, add support for nice log and symlog scale ticks Feb 26, 2026

PavelVanecek marked this pull request as ready for review February 26, 2026 14:29

PavelVanecek reviewed Feb 26, 2026

View reviewed changes

PavelVanecek force-pushed the copilot/clarify-nice-ticks branch from 35704e2 to 1067efc Compare February 27, 2026 12:05

PavelVanecek force-pushed the copilot/clarify-nice-ticks branch from 1067efc to 16fd6e2 Compare February 28, 2026 12:42

Copilot AI and others added 11 commits March 1, 2026 23:42

Initial plan

981b973

refactor(niceTicks): change niceTicks prop from boolean to NiceTicks …

59658c4

…enum Co-authored-by: PavelVanecek <1100170+PavelVanecek@users.noreply.github.com>

refactor(niceTicks): change niceTicks prop from boolean to NiceTicks …

60b0ae2

…enum Co-authored-by: PavelVanecek <1100170+PavelVanecek@users.noreply.github.com>

refactor(niceTicks): change niceTicks prop from boolean to NiceTicks …

85f02b5

…enum Co-authored-by: PavelVanecek <1100170+PavelVanecek@users.noreply.github.com>

Ticks guide WIP

7bea7d1

test(combineNiceTicks): add unit tests for combineNiceTicks function

3b44ec0

Swap niceTicks from boolean to enum; add guide, tests, support log an…

bf55a85

…d symlog scales

refactor(scale): update D3ScaleType references to RechartsScaleType f…

7d7429c

…or consistency

Update tests

1fbf3a2

Remove link from jsdoc to fix omnidoc

5b9a112

Update screenshots

f782614

PavelVanecek force-pushed the copilot/clarify-nice-ticks branch from 16fd6e2 to f782614 Compare March 1, 2026 14:49

PavelVanecek merged commit 798d6b1 into main Mar 2, 2026
43 of 47 checks passed

PavelVanecek deleted the copilot/clarify-nice-ticks branch March 2, 2026 11:55

This was referenced Mar 7, 2026

XAxis ticks not spaced evenly #4271

Closed

Add test for ticks spacing #7082

Merged

Uh oh!

Conversation

Copilot AI commented Feb 23, 2026 • edited by PavelVanecek Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Comments on the Issue (you are @copilot in this section)

Uh oh!

codecov bot commented Feb 23, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Bundle Report

Affected Assets, Files, and Routes:

Assets Changed:

Assets Changed:

Assets Changed:

Assets Changed:

Assets Changed:

Assets Changed:

Uh oh!

codecov bot commented Feb 23, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Codecov Report

Uh oh!

github-actions bot commented Feb 23, 2026

Uh oh!

Uh oh!

PavelVanecek Feb 26, 2026

Choose a reason for hiding this comment

Uh oh!

PavelVanecek Feb 26, 2026

Choose a reason for hiding this comment

Uh oh!

github-actions bot commented Feb 26, 2026

Uh oh!

github-actions bot commented Feb 27, 2026

Uh oh!

github-actions bot commented Feb 28, 2026

Uh oh!

github-actions bot commented Mar 1, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Copilot AI commented Feb 23, 2026 •

edited by PavelVanecek

Loading

codecov bot commented Feb 23, 2026 •

edited

Loading

codecov bot commented Feb 23, 2026 •

edited

Loading