diff --git a/packages/charts/src/components/BarChart/BarChart.tsx b/packages/charts/src/components/BarChart/BarChart.tsx index b5d315e2675..011889f452b 100644 --- a/packages/charts/src/components/BarChart/BarChart.tsx +++ b/packages/charts/src/components/BarChart/BarChart.tsx @@ -34,8 +34,7 @@ const formatYAxisTicks = (tick) => { }; const dimensionDefaults = { - formatter: formatYAxisTicks, - interval: 0 + formatter: formatYAxisTicks }; const measureDefaults = { @@ -62,6 +61,10 @@ interface MeasureConfig extends IChartMeasure { } interface DimensionConfig extends IChartDimension { + /** + * Interval of dimension axis labels + * @default 0 + */ interval?: number; } @@ -133,7 +136,6 @@ const BarChart: FC = forwardRef((props: BarChartProps, ref: Ref(ref); const onItemLegendClick = useLegendItemClick(onLegendClick); @@ -157,7 +159,7 @@ const BarChart: FC = forwardRef((props: BarChartProps, ref: Ref 30 ?? false; + const isBigDataSet = dataset?.length > 30; const primaryDimensionAccessor = primaryDimension?.accessor; const marginChart = useChartMargin( @@ -191,7 +193,7 @@ const BarChart: FC = forwardRef((props: BarChartProps, ref: Ref {(chartConfig.xAxisVisible ?? true) && ( = forwardRef((props: BarChartProps, ref: Ref { chartConfig={{}} dimensions={[ { - accessor: 'name', - interval: 0 + accessor: 'name' } ]} measures={[ diff --git a/packages/charts/src/components/ColumnChart/ColumnChart.tsx b/packages/charts/src/components/ColumnChart/ColumnChart.tsx index e0304d97e5b..2c81b05dd4d 100644 --- a/packages/charts/src/components/ColumnChart/ColumnChart.tsx +++ b/packages/charts/src/components/ColumnChart/ColumnChart.tsx @@ -41,6 +41,10 @@ interface MeasureConfig extends IChartMeasure { } interface DimensionConfig extends IChartDimension { + /** + * Interval of axis label + * @default 0 + */ interval?: number; } @@ -197,7 +201,7 @@ const ColumnChart: FC = forwardRef((props: ColumnChartProps, r key={dimension.accessor} dataKey={dimension.accessor} xAxisId={index} - interval={primaryDimension?.interval ?? isBigDataSet ? 'preserveStart' : 0} + interval={dimension?.interval ?? (isBigDataSet ? 'preserveStart' : 0)} tick={index === 0 ? XAxisLabel : SecondaryDimensionLabel} tickLine={index < 1} axisLine={index < 1} @@ -209,7 +213,7 @@ const ColumnChart: FC = forwardRef((props: ColumnChartProps, r tickLine={false} yAxisId="left" tickFormatter={primaryMeasure?.formatter} - interval={'preserveStart'} + interval={0} /> {chartConfig.secondYAxis && chartConfig.secondYAxis.dataKey && ( { dimensions={[ { accessor: 'name', - formatter: (d) => `${d} 2019`, - interval: 0 + formatter: (d) => `${d} 2019` } ]} measures={[ diff --git a/packages/charts/src/components/ComposedChart/index.tsx b/packages/charts/src/components/ComposedChart/index.tsx index 01dd58851d5..cd09277e58f 100644 --- a/packages/charts/src/components/ComposedChart/index.tsx +++ b/packages/charts/src/components/ComposedChart/index.tsx @@ -238,7 +238,7 @@ const ComposedChart: FC = forwardRef((props: ComposedChartPr key={dimension.accessor} dataKey={dimension.accessor} xAxisId={index} - interval={primaryDimension?.interval ?? isBigDataSet ? 'preserveStart' : 0} + interval={dimension?.interval ?? (isBigDataSet ? 'preserveStart' : 0)} tick={index === 0 ? XAxisLabel : SecondaryDimensionLabel} tickLine={index < 1} axisLine={index < 1} @@ -251,7 +251,7 @@ const ComposedChart: FC = forwardRef((props: ComposedChartPr tickLine={false} yAxisId="left" tickFormatter={primaryMeasure?.formatter} - interval={'preserveStart'} + interval={0} /> {chartConfig.secondYAxis && chartConfig.secondYAxis.dataKey && ( = forwardRef((props: LineChartProps, ref: Re key={dimension.accessor} dataKey={dimension.accessor} xAxisId={index} - interval={primaryDimension?.interval ?? isBigDataSet ? 'preserveStart' : 0} + interval={dimension?.interval ?? (isBigDataSet ? 'preserveStart' : 0)} tick={index === 0 ? XAxisLabel : SecondaryDimensionLabel} tickLine={index < 1} axisLine={index < 1}