Skip to content

[charts] Default bar chart x-axis scale type to band #17519

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 9 commits into
base: master
Choose a base branch
from

Conversation

bernardobelchior
Copy link
Member

@bernardobelchior bernardobelchior commented Apr 23, 2025

Fixes #13794.

This fix surfaced an issue that applies to all charts when scaleType isn't defined and valueFormatter is. In that case, a type error will show because the values will implicitly have any as a type. To fix that, I added back scaleType: 'band' in some examples (commit).

We either have wrong types or are facing a limit in TypeScript, not sure which. However, this seems to only apply for certain TypeScript configurations (noImplicitAny: true), so this isn't a major issue IMO and this PR is an improvement over the current state of things.

Copy link

github-actions bot commented Apr 23, 2025

Thanks for adding a type label to the PR! 👍

@bernardobelchior bernardobelchior added new feature New feature or request component: charts This is the name of the generic UI component, not the React module! enhancement This is not a bug, nor a new feature and removed new feature New feature or request labels Apr 23, 2025
@mui-bot
Copy link

mui-bot commented Apr 23, 2025

Deploy preview: https://deploy-preview-17519--material-ui-x.netlify.app/

Generated by 🚫 dangerJS against 865abf1

Copy link

codspeed-hq bot commented Apr 23, 2025

CodSpeed Performance Report

Merging #17519 will not alter performance

Comparing bernardobelchior:default-bar-chart-x-axis-scale-type (865abf1) with master (cb55e58)

Summary

✅ 8 untouched benchmarks

Copy link

This pull request has conflicts, please resolve those before we can evaluate the pull request.

@github-actions github-actions bot added the PR: out-of-date The pull request has merge conflicts and can't be merged label Apr 24, 2025
@bernardobelchior bernardobelchior force-pushed the default-bar-chart-x-axis-scale-type branch from 6392f2a to c23dab3 Compare April 24, 2025 09:03
@github-actions github-actions bot removed the PR: out-of-date The pull request has merge conflicts and can't be merged label Apr 24, 2025
@bernardobelchior bernardobelchior requested review from alexfauquette and JCQuintas and removed request for alexfauquette April 24, 2025 15:19
@bernardobelchior bernardobelchior marked this pull request as ready for review April 24, 2025 15:19
Comment on lines 99 to 103
const defaultXAxis = hasHorizontalSeries ? undefined : defaultBandXAxis;
const processedXAxis = React.useMemo(
() => (xAxis ? xAxis.map((axis) => ({ scaleType: 'band' as const, ...axis })) : defaultXAxis),
[defaultXAxis, xAxis],
);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If I get it correctly, this causes issues with the following config. Even if the layout is horizontal, the xAxis will get a band scale, which is not the expected behavior

<BarChart
  xAxis={[{ min: 0, max: 100 }]}
  layout="horizontal"
  {...}
/>

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good point. Didn't think of the horizontal case. Will fix

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
component: charts This is the name of the generic UI component, not the React module! enhancement This is not a bug, nor a new feature
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[charts] Allow to partially provide bar/line charts x-axis
3 participants