[charts] Add domainLimit to axis config

packages/x-charts-pro/src/BarChartPro/BarChartPro.tsx

@@ -350,6 +350,7 @@ BarChartPro.propTypes = {
       dataKey: PropTypes.string,
       disableLine: PropTypes.bool,
       disableTicks: PropTypes.bool,
+      domainLimit: PropTypes.oneOf(['nice', 'strict']),
       fill: PropTypes.string,
       hideTooltip: PropTypes.bool,
       id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
@@ -437,6 +438,7 @@ BarChartPro.propTypes = {
       dataKey: PropTypes.string,
       disableLine: PropTypes.bool,
       disableTicks: PropTypes.bool,
+      domainLimit: PropTypes.oneOf(['nice', 'strict']),
       fill: PropTypes.string,
       hideTooltip: PropTypes.bool,
       id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),

packages/x-charts-pro/src/ChartContainerPro/ChartContainerPro.tsx

@@ -196,6 +196,7 @@ ChartContainerPro.propTypes = {
       dataKey: PropTypes.string,
       disableLine: PropTypes.bool,
       disableTicks: PropTypes.bool,
+      domainLimit: PropTypes.oneOf(['nice', 'strict']),
       fill: PropTypes.string,
       hideTooltip: PropTypes.bool,
       id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
@@ -283,6 +284,7 @@ ChartContainerPro.propTypes = {
       dataKey: PropTypes.string,
       disableLine: PropTypes.bool,
       disableTicks: PropTypes.bool,
+      domainLimit: PropTypes.oneOf(['nice', 'strict']),
       fill: PropTypes.string,
       hideTooltip: PropTypes.bool,
       id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),

packages/x-charts-pro/src/Heatmap/Heatmap.tsx

@@ -392,6 +392,7 @@ Heatmap.propTypes = {
       dataKey: PropTypes.string,
       disableLine: PropTypes.bool,
       disableTicks: PropTypes.bool,
+      domainLimit: PropTypes.oneOf(['nice', 'strict']),
       fill: PropTypes.string,
       hideTooltip: PropTypes.bool,
       id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
@@ -481,6 +482,7 @@ Heatmap.propTypes = {
       dataKey: PropTypes.string,
       disableLine: PropTypes.bool,
       disableTicks: PropTypes.bool,
+      domainLimit: PropTypes.oneOf(['nice', 'strict']),
       fill: PropTypes.string,
       hideTooltip: PropTypes.bool,
       id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),

packages/x-charts-pro/src/LineChartPro/LineChartPro.tsx

@@ -422,6 +422,7 @@ LineChartPro.propTypes = {
       dataKey: PropTypes.string,
       disableLine: PropTypes.bool,
       disableTicks: PropTypes.bool,
+      domainLimit: PropTypes.oneOf(['nice', 'strict']),
       fill: PropTypes.string,
       hideTooltip: PropTypes.bool,
       id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
@@ -509,6 +510,7 @@ LineChartPro.propTypes = {
       dataKey: PropTypes.string,
       disableLine: PropTypes.bool,
       disableTicks: PropTypes.bool,
+      domainLimit: PropTypes.oneOf(['nice', 'strict']),
       fill: PropTypes.string,
       hideTooltip: PropTypes.bool,
       id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),

packages/x-charts-pro/src/ResponsiveChartContainerPro/ResponsiveChartContainerPro.tsx

@@ -169,6 +169,7 @@ ResponsiveChartContainerPro.propTypes = {
       dataKey: PropTypes.string,
       disableLine: PropTypes.bool,
       disableTicks: PropTypes.bool,
+      domainLimit: PropTypes.oneOf(['nice', 'strict']),
       fill: PropTypes.string,
       hideTooltip: PropTypes.bool,
       id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
@@ -256,6 +257,7 @@ ResponsiveChartContainerPro.propTypes = {
       dataKey: PropTypes.string,
       disableLine: PropTypes.bool,
       disableTicks: PropTypes.bool,
+      domainLimit: PropTypes.oneOf(['nice', 'strict']),
       fill: PropTypes.string,
       hideTooltip: PropTypes.bool,
       id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),

packages/x-charts-pro/src/ScatterChartPro/ScatterChartPro.tsx

@@ -291,6 +291,7 @@ ScatterChartPro.propTypes = {
       dataKey: PropTypes.string,
       disableLine: PropTypes.bool,
       disableTicks: PropTypes.bool,
+      domainLimit: PropTypes.oneOf(['nice', 'strict']),
       fill: PropTypes.string,
       hideTooltip: PropTypes.bool,
       id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
@@ -378,6 +379,7 @@ ScatterChartPro.propTypes = {
       dataKey: PropTypes.string,
       disableLine: PropTypes.bool,
       disableTicks: PropTypes.bool,
+      domainLimit: PropTypes.oneOf(['nice', 'strict']),
       fill: PropTypes.string,
       hideTooltip: PropTypes.bool,
       id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),

packages/x-charts/src/BarChart/BarChart.tsx

@@ -362,6 +362,7 @@ BarChart.propTypes = {
       dataKey: PropTypes.string,
       disableLine: PropTypes.bool,
       disableTicks: PropTypes.bool,
+      domainLimit: PropTypes.oneOf(['nice', 'strict']),
       fill: PropTypes.string,
       hideTooltip: PropTypes.bool,
       id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
@@ -437,6 +438,7 @@ BarChart.propTypes = {
       dataKey: PropTypes.string,
       disableLine: PropTypes.bool,
       disableTicks: PropTypes.bool,
+      domainLimit: PropTypes.oneOf(['nice', 'strict']),
       fill: PropTypes.string,
       hideTooltip: PropTypes.bool,
       id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),

packages/x-charts/src/ChartContainer/ChartContainer.tsx

@@ -203,6 +203,7 @@ ChartContainer.propTypes = {
       dataKey: PropTypes.string,
       disableLine: PropTypes.bool,
       disableTicks: PropTypes.bool,
+      domainLimit: PropTypes.oneOf(['nice', 'strict']),
       fill: PropTypes.string,
       hideTooltip: PropTypes.bool,
       id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
@@ -278,6 +279,7 @@ ChartContainer.propTypes = {
       dataKey: PropTypes.string,
       disableLine: PropTypes.bool,
       disableTicks: PropTypes.bool,
+      domainLimit: PropTypes.oneOf(['nice', 'strict']),
       fill: PropTypes.string,
       hideTooltip: PropTypes.bool,
       id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),

packages/x-charts/src/LineChart/LineChart.tsx

@@ -398,6 +398,7 @@ LineChart.propTypes = {
       dataKey: PropTypes.string,
       disableLine: PropTypes.bool,
       disableTicks: PropTypes.bool,
+      domainLimit: PropTypes.oneOf(['nice', 'strict']),
       fill: PropTypes.string,
       hideTooltip: PropTypes.bool,
       id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
@@ -473,6 +474,7 @@ LineChart.propTypes = {
       dataKey: PropTypes.string,
       disableLine: PropTypes.bool,
       disableTicks: PropTypes.bool,
+      domainLimit: PropTypes.oneOf(['nice', 'strict']),
       fill: PropTypes.string,
       hideTooltip: PropTypes.bool,
       id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),

packages/x-charts/src/PieChart/PieChart.tsx

@@ -300,6 +300,7 @@ PieChart.propTypes = {
       dataKey: PropTypes.string,
       disableLine: PropTypes.bool,
       disableTicks: PropTypes.bool,
+      domainLimit: PropTypes.oneOf(['nice', 'strict']),
       fill: PropTypes.string,
       hideTooltip: PropTypes.bool,
       id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
@@ -375,6 +376,7 @@ PieChart.propTypes = {
       dataKey: PropTypes.string,
       disableLine: PropTypes.bool,
       disableTicks: PropTypes.bool,
+      domainLimit: PropTypes.oneOf(['nice', 'strict']),
       fill: PropTypes.string,
       hideTooltip: PropTypes.bool,
       id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),

packages/x-charts/src/ResponsiveChartContainer/ResponsiveChartContainer.tsx

@@ -174,6 +174,7 @@ ResponsiveChartContainer.propTypes = {
       dataKey: PropTypes.string,
       disableLine: PropTypes.bool,
       disableTicks: PropTypes.bool,
+      domainLimit: PropTypes.oneOf(['nice', 'strict']),
       fill: PropTypes.string,
       hideTooltip: PropTypes.bool,
       id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
@@ -249,6 +250,7 @@ ResponsiveChartContainer.propTypes = {
       dataKey: PropTypes.string,
       disableLine: PropTypes.bool,
       disableTicks: PropTypes.bool,
+      domainLimit: PropTypes.oneOf(['nice', 'strict']),
       fill: PropTypes.string,
       hideTooltip: PropTypes.bool,
       id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),

packages/x-charts/src/ScatterChart/ScatterChart.tsx

@@ -357,6 +357,7 @@ ScatterChart.propTypes = {
       dataKey: PropTypes.string,
       disableLine: PropTypes.bool,
       disableTicks: PropTypes.bool,
+      domainLimit: PropTypes.oneOf(['nice', 'strict']),
       fill: PropTypes.string,
       hideTooltip: PropTypes.bool,
       id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
@@ -432,6 +433,7 @@ ScatterChart.propTypes = {
       dataKey: PropTypes.string,
       disableLine: PropTypes.bool,
       disableTicks: PropTypes.bool,
+      domainLimit: PropTypes.oneOf(['nice', 'strict']),
       fill: PropTypes.string,
       hideTooltip: PropTypes.bool,
       id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),

packages/x-charts/src/SparkLineChart/SparkLineChart.tsx

@@ -423,6 +423,7 @@ SparkLineChart.propTypes = {
     dataKey: PropTypes.string,
     disableLine: PropTypes.bool,
     disableTicks: PropTypes.bool,
+    domainLimit: PropTypes.oneOf(['nice', 'strict']),
     fill: PropTypes.string,
     hideTooltip: PropTypes.bool,
     id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
@@ -489,6 +490,7 @@ SparkLineChart.propTypes = {
     dataKey: PropTypes.string,
     disableLine: PropTypes.bool,
     disableTicks: PropTypes.bool,
+    domainLimit: PropTypes.oneOf(['nice', 'strict']),
     fill: PropTypes.string,
     hideTooltip: PropTypes.bool,
     id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),

packages/x-charts/src/internals/computeAxisValue.ts

@@ -204,16 +204,16 @@ export function computeAxisValue({
 
     const zoomedRange = zoomScaleRange(range, zoomRange);
 
-    // TODO: move nice to prop? Disable when there is zoom?
-    const scale = getScale(scaleType, axisExtremums, zoomedRange).nice(rawTickNumber);
-    const [minDomain, maxDomain] = scale.domain();
+    const scale = getScale(scaleType, axisExtremums, zoomedRange);
+    const finalScale = axis.domainLimit === 'strict' ? scale : scale.nice(rawTickNumber);
+    const [minDomain, maxDomain] = finalScale.domain();
     const domain = [axis.min ?? minDomain, axis.max ?? maxDomain];
 
     completeAxis[axis.id] = {
       ...axis,
       data,
       scaleType: scaleType as any,
-      scale: scale.domain(domain) as any,
+      scale: finalScale.domain(domain) as any,
       tickNumber,
       colorScale: axis.colorMap && getColorScale(axis.colorMap),
     };

packages/x-charts/src/models/axis.ts

@@ -333,6 +333,12 @@ export type AxisConfig<
    * If `true`, Reverse the axis scaleBand.
    */
   reverse?: boolean;
+  /**
+   * Defines the axis scale domain based on the min/max values of series linked to it.
+   * - 'nice': Uses the `.nice()` method from d3-scale to round the domain at human friendly values.
+   * - 'strict': Set the domain to the min/max value displayed. No extras space is added.
+   */
+  domainLimit?: 'nice' | 'strict';
 } & Omit<Partial<AxisProps>, 'axisId'> &
   Partial<Omit<AxisScaleConfig[S], 'scale'>> &
   TickParams &