mirror of
https://github.com/apache/superset.git
synced 2024-09-19 20:19:37 -04:00
feat(time-format): add full-date to weekly time formatter (#486)
This commit is contained in:
parent
995bbee615
commit
868ebbe09d
@ -37,6 +37,7 @@ const formData = {
|
||||
metric: 'sum__SP_POP_TOTL',
|
||||
showTrendLine: true,
|
||||
startYAxisAtZero: true,
|
||||
timeGrainSqla: 'P1Y',
|
||||
vizType: 'big_number',
|
||||
yAxisFormat: '.3s',
|
||||
};
|
||||
@ -68,6 +69,19 @@ export const basicWithTrendline = () => (
|
||||
/>
|
||||
);
|
||||
|
||||
export const weeklyTimeGranularity = () => (
|
||||
<SuperChart
|
||||
chartType="big-number"
|
||||
width={400}
|
||||
height={400}
|
||||
queryData={{ data: testData }}
|
||||
formData={{
|
||||
...formData,
|
||||
timeGrainSqla: 'P1W',
|
||||
}}
|
||||
/>
|
||||
);
|
||||
|
||||
export const nullInTheMiddle = () => (
|
||||
<SuperChart
|
||||
chartType="big-number"
|
||||
@ -90,7 +104,6 @@ export const fixedRange = () => (
|
||||
}}
|
||||
formData={{
|
||||
...formData,
|
||||
timeGrainSqla: 'P1Y',
|
||||
timeRangeFixed: true,
|
||||
}}
|
||||
/>
|
||||
|
@ -16,12 +16,15 @@
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
import { getTimeFormatter, TimeFormats, smartDateVerboseFormatter } from '@superset-ui/time-format';
|
||||
import TimeFormats from '../TimeFormats';
|
||||
import { getTimeFormatter } from '../TimeFormatterRegistrySingleton';
|
||||
import smartDateVerboseFormatter from '../formatters/smartDateVerbose';
|
||||
import { TimeGranularity } from '../types';
|
||||
|
||||
// Translate time granularity to d3-format
|
||||
const MINUTE = '%Y-%m-%d %H:%M';
|
||||
const SUNDAY_BASED_WEEK = '%Y W%U';
|
||||
const MONDAY_BASED_WEEK = '%Y W%W';
|
||||
const SUNDAY_BASED_WEEK = '%Y-%m-%d W%U';
|
||||
const MONDAY_BASED_WEEK = '%Y-%m-%d W%W';
|
||||
const { DATABASE_DATE, DATABASE_DATETIME } = TimeFormats;
|
||||
|
||||
// search for `builtin_time_grains` in incubator-superset/superset/db_engine_specs/base.py
|
||||
@ -39,16 +42,13 @@ const formats = {
|
||||
P1M: '%Y-%m', // month
|
||||
'P0.25Y': '%Y Q%q', // quarter
|
||||
P1Y: '%Y', // year
|
||||
// d3-time-format weeks does not support weeks start on Sunday
|
||||
'1969-12-28T00:00:00Z/P1W': SUNDAY_BASED_WEEK, // 'week_start_sunday'
|
||||
'1969-12-29T00:00:00Z/P1W': MONDAY_BASED_WEEK, // 'week_start_monday'
|
||||
'P1W/1970-01-03T00:00:00Z': SUNDAY_BASED_WEEK, // 'week_ending_saturday'
|
||||
'P1W/1970-01-04T00:00:00Z': MONDAY_BASED_WEEK, // 'week_ending_sunday'
|
||||
};
|
||||
|
||||
export type TimeGranularity = keyof typeof formats;
|
||||
|
||||
export default function getTimeFormatterForGranularity(granularity: TimeGranularity | undefined) {
|
||||
export default function getTimeFormatterForGranularity(granularity?: TimeGranularity) {
|
||||
return granularity && granularity in formats
|
||||
? getTimeFormatter(formats[granularity])
|
||||
: smartDateVerboseFormatter;
|
@ -9,6 +9,9 @@ export {
|
||||
|
||||
export { default as createD3TimeFormatter } from './factories/createD3TimeFormatter';
|
||||
export { default as createMultiFormatter } from './factories/createMultiFormatter';
|
||||
export { default as getTimeFormatterForGranularity } from './factories/getTimeFormatterForGranularity';
|
||||
|
||||
export { default as smartDateFormatter } from './formatters/smartDate';
|
||||
export { default as smartDateVerboseFormatter } from './formatters/smartDateVerbose';
|
||||
|
||||
export * from './types';
|
||||
|
@ -1 +1,20 @@
|
||||
export type TimeFormatFunction = (value: Date) => string;
|
||||
|
||||
export type TimeGranularity =
|
||||
| 'date'
|
||||
| 'PT1S'
|
||||
| 'PT1M'
|
||||
| 'PT5M'
|
||||
| 'PT10M'
|
||||
| 'PT15M'
|
||||
| 'PT0.5H'
|
||||
| 'PT1H'
|
||||
| 'P1D'
|
||||
| 'P1W'
|
||||
| 'P1M'
|
||||
| 'P0.25Y'
|
||||
| 'P1Y'
|
||||
| '1969-12-28T00:00:00Z/P1W'
|
||||
| '1969-12-29T00:00:00Z/P1W'
|
||||
| 'P1W/1970-01-03T00:00:00Z'
|
||||
| 'P1W/1970-01-04T00:00:00Z';
|
||||
|
@ -0,0 +1,34 @@
|
||||
import getFormatter from '../../src/factories/getTimeFormatterForGranularity';
|
||||
import smartDateVerbose from '../../src/formatters/smartDateVerbose';
|
||||
|
||||
describe('getTimeFormatterForGranularity()', () => {
|
||||
it('use smartDate when granularity unknown or undefined', () => {
|
||||
expect(getFormatter(undefined)).toBe(smartDateVerbose);
|
||||
// @ts-ignore
|
||||
expect(getFormatter('random-string')).toBe(smartDateVerbose);
|
||||
});
|
||||
|
||||
it('format time for known granularities', () => {
|
||||
// JS Date constructor month is zero-based
|
||||
const date = new Date(2020, 4, 10, 11, 10, 1); // May 10, 2020 is Sunday
|
||||
expect(getFormatter('date')(date)).toBe('2020-05-10');
|
||||
expect(getFormatter('PT1S')(date)).toBe('2020-05-10 11:10:01');
|
||||
expect(getFormatter('PT1M')(date)).toBe('2020-05-10 11:10');
|
||||
expect(getFormatter('PT5M')(date)).toBe('2020-05-10 11:10');
|
||||
expect(getFormatter('PT10M')(date)).toBe('2020-05-10 11:10');
|
||||
expect(getFormatter('PT15M')(date)).toBe('2020-05-10 11:10');
|
||||
expect(getFormatter('PT0.5H')(date)).toBe('2020-05-10 11:10');
|
||||
expect(getFormatter('PT1H')(date)).toBe('2020-05-10 11:00');
|
||||
expect(getFormatter('P1D')(date)).toBe('2020-05-10');
|
||||
expect(getFormatter('P1W')(date)).toBe('2020-05-10 W19');
|
||||
expect(getFormatter('P1M')(date)).toBe('2020-05');
|
||||
expect(getFormatter('P0.25Y')(date)).toBe('2020 Q2');
|
||||
expect(getFormatter('P1Y')(date)).toBe('2020');
|
||||
// sunday based week
|
||||
expect(getFormatter('1969-12-28T00:00:00Z/P1W')(date)).toBe('2020-05-10 W19');
|
||||
expect(getFormatter('P1W/1970-01-03T00:00:00Z')(date)).toBe('2020-05-10 W19');
|
||||
// monday based week
|
||||
expect(getFormatter('1969-12-29T00:00:00Z/P1W')(date)).toBe('2020-05-10 W18');
|
||||
expect(getFormatter('P1W/1970-01-04T00:00:00Z')(date)).toBe('2020-05-10 W18');
|
||||
});
|
||||
});
|
@ -19,9 +19,7 @@
|
||||
import * as color from 'd3-color';
|
||||
import { getNumberFormatter, NumberFormats } from '@superset-ui/number-format';
|
||||
import { ChartProps } from '@superset-ui/chart';
|
||||
import getTimeFormatterForGranularity, {
|
||||
TimeGranularity,
|
||||
} from '../utils/getTimeFormatterForGranularity';
|
||||
import { TimeGranularity, getTimeFormatterForGranularity } from '@superset-ui/time-format';
|
||||
|
||||
const TIME_COLUMN = '__timestamp';
|
||||
const formatPercentChange = getNumberFormatter(NumberFormats.PERCENT_SIGNED_1_POINT);
|
||||
|
@ -17,11 +17,11 @@
|
||||
* under the License.
|
||||
*/
|
||||
import { DatasourceType } from '@superset-ui/query';
|
||||
import { TimeGranularity } from '@superset-ui/time-format';
|
||||
import transformProps, {
|
||||
BignumberChartProps,
|
||||
BigNumberDatum,
|
||||
} from '../src/BigNumber/transformProps';
|
||||
import { TimeGranularity } from '../src/utils/getTimeFormatterForGranularity';
|
||||
|
||||
const formData = {
|
||||
metric: 'value',
|
||||
|
Loading…
Reference in New Issue
Block a user