chore(react-chart): fix default tick format for small viewport (#1945)

DevExpress · Apr 2, 2019 · 7fdf293 · 7fdf293
1 parent 12cf72b
commit 7fdf293
Show file tree

Hide file tree

Showing 4 changed files with 7 additions and 5 deletions.
diff --git a/packages/dx-chart-core/src/plugins/axis/computeds.test.ts b/packages/dx-chart-core/src/plugins/axis/computeds.test.ts
@@ -147,6 +147,7 @@ describe('axisCoordinates', () => {
           textAnchor: 'middle',
           y1: 0, y2: -5, x1: 25, x2: 25,
         }]);
+        expect(scale.tickFormat).toBeCalledWith(10);
       } finally {
         delete scale.tickFormat;
       }
@@ -175,6 +176,7 @@ describe('axisCoordinates', () => {
           textAnchor: 'middle',
           y1: 0, y2: -5, x1: 25, x2: 25,
         }]);
+        expect(userFormat).toBeCalledWith(scale, 10);
       } finally {
         delete scale.tickFormat;
       }

diff --git a/packages/dx-chart-core/src/plugins/axis/computeds.ts b/packages/dx-chart-core/src/plugins/axis/computeds.ts
@@ -19,9 +19,9 @@ const createTicks = <T>(
     .map((tick, index) => callback(fixedScale(tick), String(index), tick));
 };
 
-const getFormat = (scale: ScaleObject, tickFormat?: TickFormatFn): GetFormatFn => {
+const getFormat = (scale: ScaleObject, count: number, tickFormat?: TickFormatFn): GetFormatFn => {
   if (scale.tickFormat) {
-    return tickFormat ? tickFormat(scale) : scale.tickFormat();
+    return tickFormat ? tickFormat(scale, count) : scale.tickFormat(count);
   }
   return tick => tick;
 };
@@ -73,7 +73,7 @@ export const axisCoordinates: AxisCoordinatesFn = ({
     position, tickSize, indentFromAxis,
   );
   const tickCount = getTickCount(scale.range(), paneSize[1 - Number(isHor)]);
-  const formatTick = getFormat(scale, tickFormat);
+  const formatTick = getFormat(scale, tickCount, tickFormat);
   const ticks = createTicks(scale, tickCount, (coordinates, key, tick) => ({
     key,
     x1: coordinates,

diff --git a/packages/dx-chart-core/src/types/plugins.axis.types.ts b/packages/dx-chart-core/src/types/plugins.axis.types.ts
@@ -4,7 +4,7 @@ import {
 } from './chart-core.types';
 /** @internal */
 export type ProcessTickFn<T> = (coord: number, key: string, tick: any) => T;
-export type TickFormatFn = (scale: ScaleObject) => GetFormatFn;
+export type TickFormatFn = (scale: ScaleObject, count?: number) => GetFormatFn;
 /** @internal */
 export type AxisCoordinatesArg = {
   scaleName: string;

diff --git a/packages/dx-react-chart/api/dx-react-chart.api.ts b/packages/dx-react-chart/api/dx-react-chart.api.ts
@@ -490,7 +490,7 @@ interface TargetData {
 declare type TargetList = ReadonlyArray<SeriesRef>;
 
 // @public (undocumented)
-declare type TickFormatFn = (scale: ScaleObject) => GetFormatFn;
+declare type TickFormatFn = (scale: ScaleObject, count?: number) => GetFormatFn;
 
 // @public (undocumented)
 declare const Title: React.ComponentType<TitleProps>;