mirror of https://github.com/apache/superset.git
feat: derived metrics use different line style (#20242)
This commit is contained in:
parent
dd4b581fb5
commit
7faf874c1b
|
@ -19,4 +19,5 @@
|
||||||
*/
|
*/
|
||||||
export { getMetricOffsetsMap } from './getMetricOffsetsMap';
|
export { getMetricOffsetsMap } from './getMetricOffsetsMap';
|
||||||
export { isTimeComparison } from './isTimeComparison';
|
export { isTimeComparison } from './isTimeComparison';
|
||||||
|
export { isDerivedSeries } from './isDerivedSeries';
|
||||||
export { TIME_COMPARISON_SEPARATOR } from './constants';
|
export { TIME_COMPARISON_SEPARATOR } from './constants';
|
||||||
|
|
|
@ -0,0 +1,41 @@
|
||||||
|
/* eslint-disable camelcase */
|
||||||
|
/**
|
||||||
|
* Licensed to the Apache Software Foundation (ASF) under one
|
||||||
|
* or more contributor license agreements. See the NOTICE file
|
||||||
|
* distributed with this work for additional information
|
||||||
|
* regarding copyright ownership. The ASF licenses this file
|
||||||
|
* to you under the Apache License, Version 2.0 (the
|
||||||
|
* "License"); you may not use this file except in compliance
|
||||||
|
* with the License. You may obtain a copy of the License at
|
||||||
|
*
|
||||||
|
* http://www.apache.org/licenses/LICENSE-2.0
|
||||||
|
*
|
||||||
|
* Unless required by applicable law or agreed to in writing,
|
||||||
|
* software distributed under the License is distributed on an
|
||||||
|
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||||
|
* KIND, either express or implied. See the License for the
|
||||||
|
* specific language governing permissions and limitationsxw
|
||||||
|
* under the License.
|
||||||
|
*/
|
||||||
|
import {
|
||||||
|
ensureIsArray,
|
||||||
|
JsonObject,
|
||||||
|
QueryFormData,
|
||||||
|
ComparisionType,
|
||||||
|
} from '@superset-ui/core';
|
||||||
|
import { isString } from 'lodash';
|
||||||
|
|
||||||
|
export const isDerivedSeries = (
|
||||||
|
series: JsonObject,
|
||||||
|
formData: QueryFormData,
|
||||||
|
): boolean => {
|
||||||
|
const comparisonType = formData.comparison_type;
|
||||||
|
if (comparisonType !== ComparisionType.Values) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
const timeCompare: string[] = ensureIsArray(formData?.time_compare);
|
||||||
|
return isString(series.name)
|
||||||
|
? !!timeCompare.find(timeOffset => series.name.endsWith(timeOffset))
|
||||||
|
: false;
|
||||||
|
};
|
|
@ -17,7 +17,7 @@
|
||||||
* under the License.
|
* under the License.
|
||||||
*/
|
*/
|
||||||
import { QueryObject, SqlaFormData } from '@superset-ui/core';
|
import { QueryObject, SqlaFormData } from '@superset-ui/core';
|
||||||
import { boxplotOperator } from '../../../src';
|
import { boxplotOperator } from '@superset-ui/chart-controls';
|
||||||
|
|
||||||
const formData: SqlaFormData = {
|
const formData: SqlaFormData = {
|
||||||
metrics: [
|
metrics: [
|
|
@ -17,7 +17,7 @@
|
||||||
* under the License.
|
* under the License.
|
||||||
*/
|
*/
|
||||||
import { QueryObject, SqlaFormData } from '@superset-ui/core';
|
import { QueryObject, SqlaFormData } from '@superset-ui/core';
|
||||||
import { contributionOperator } from '../../../src';
|
import { contributionOperator } from '@superset-ui/chart-controls';
|
||||||
|
|
||||||
const formData: SqlaFormData = {
|
const formData: SqlaFormData = {
|
||||||
metrics: [
|
metrics: [
|
|
@ -17,7 +17,7 @@
|
||||||
* under the License.
|
* under the License.
|
||||||
*/
|
*/
|
||||||
import { QueryObject, SqlaFormData } from '@superset-ui/core';
|
import { QueryObject, SqlaFormData } from '@superset-ui/core';
|
||||||
import { pivotOperator } from '../../../src';
|
import { pivotOperator } from '@superset-ui/chart-controls';
|
||||||
|
|
||||||
const formData: SqlaFormData = {
|
const formData: SqlaFormData = {
|
||||||
metrics: [
|
metrics: [
|
|
@ -17,7 +17,7 @@
|
||||||
* under the License.
|
* under the License.
|
||||||
*/
|
*/
|
||||||
import { DTTM_ALIAS, QueryObject, SqlaFormData } from '@superset-ui/core';
|
import { DTTM_ALIAS, QueryObject, SqlaFormData } from '@superset-ui/core';
|
||||||
import { prophetOperator } from '../../../src';
|
import { prophetOperator } from '@superset-ui/chart-controls';
|
||||||
|
|
||||||
const formData: SqlaFormData = {
|
const formData: SqlaFormData = {
|
||||||
metrics: [
|
metrics: [
|
|
@ -17,7 +17,7 @@
|
||||||
* under the License.
|
* under the License.
|
||||||
*/
|
*/
|
||||||
import { QueryObject, SqlaFormData } from '@superset-ui/core';
|
import { QueryObject, SqlaFormData } from '@superset-ui/core';
|
||||||
import { rollingWindowOperator } from '../../../src';
|
import { rollingWindowOperator } from '@superset-ui/chart-controls';
|
||||||
|
|
||||||
const formData: SqlaFormData = {
|
const formData: SqlaFormData = {
|
||||||
metrics: [
|
metrics: [
|
|
@ -17,7 +17,7 @@
|
||||||
* under the License.
|
* under the License.
|
||||||
*/
|
*/
|
||||||
import { QueryObject, SqlaFormData } from '@superset-ui/core';
|
import { QueryObject, SqlaFormData } from '@superset-ui/core';
|
||||||
import { sortOperator } from '../../../src';
|
import { sortOperator } from '@superset-ui/chart-controls';
|
||||||
|
|
||||||
const formData: SqlaFormData = {
|
const formData: SqlaFormData = {
|
||||||
metrics: [
|
metrics: [
|
|
@ -17,7 +17,7 @@
|
||||||
* under the License.
|
* under the License.
|
||||||
*/
|
*/
|
||||||
import { QueryObject, SqlaFormData } from '@superset-ui/core';
|
import { QueryObject, SqlaFormData } from '@superset-ui/core';
|
||||||
import { timeCompareOperator } from '../../../src';
|
import { timeCompareOperator } from '@superset-ui/chart-controls';
|
||||||
|
|
||||||
const formData: SqlaFormData = {
|
const formData: SqlaFormData = {
|
||||||
metrics: [
|
metrics: [
|
|
@ -17,7 +17,10 @@
|
||||||
* under the License.
|
* under the License.
|
||||||
*/
|
*/
|
||||||
import { QueryObject, SqlaFormData } from '@superset-ui/core';
|
import { QueryObject, SqlaFormData } from '@superset-ui/core';
|
||||||
import { timeCompareOperator, timeComparePivotOperator } from '../../../src';
|
import {
|
||||||
|
timeCompareOperator,
|
||||||
|
timeComparePivotOperator,
|
||||||
|
} from '@superset-ui/chart-controls';
|
||||||
|
|
||||||
const formData: SqlaFormData = {
|
const formData: SqlaFormData = {
|
||||||
metrics: [
|
metrics: [
|
|
@ -0,0 +1,99 @@
|
||||||
|
/**
|
||||||
|
* Licensed to the Apache Software Foundation (ASF) under one
|
||||||
|
* or more contributor license agreements. See the NOTICE file
|
||||||
|
* distributed with this work for additional information
|
||||||
|
* regarding copyright ownership. The ASF licenses this file
|
||||||
|
* to you under the Apache License, Version 2.0 (the
|
||||||
|
* "License"); you may not use this file except in compliance
|
||||||
|
* with the License. You may obtain a copy of the License at
|
||||||
|
*
|
||||||
|
* http://www.apache.org/licenses/LICENSE-2.0
|
||||||
|
*
|
||||||
|
* Unless required by applicable law or agreed to in writing,
|
||||||
|
* software distributed under the License is distributed on an
|
||||||
|
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||||
|
* KIND, either express or implied. See the License for the
|
||||||
|
* specific language governing permissions and limitations
|
||||||
|
* under the License.
|
||||||
|
*/
|
||||||
|
import { isDerivedSeries } from '@superset-ui/chart-controls';
|
||||||
|
import { SqlaFormData, ComparisionType } from '@superset-ui/core';
|
||||||
|
|
||||||
|
const formData: SqlaFormData = {
|
||||||
|
datasource: 'foo',
|
||||||
|
viz_type: 'table',
|
||||||
|
};
|
||||||
|
const series = {
|
||||||
|
id: 'metric__1 month ago',
|
||||||
|
name: 'metric__1 month ago',
|
||||||
|
data: [100],
|
||||||
|
};
|
||||||
|
|
||||||
|
test('should be false if comparison type is not actual values', () => {
|
||||||
|
expect(isDerivedSeries(series, formData)).toEqual(false);
|
||||||
|
Object.keys(ComparisionType)
|
||||||
|
.filter(type => type === ComparisionType.Values)
|
||||||
|
.forEach(type => {
|
||||||
|
const formDataWithComparisionType = {
|
||||||
|
...formData,
|
||||||
|
comparison_type: type,
|
||||||
|
time_compare: ['1 month ago'],
|
||||||
|
};
|
||||||
|
expect(isDerivedSeries(series, formDataWithComparisionType)).toEqual(
|
||||||
|
false,
|
||||||
|
);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
test('should be true if comparison type is values', () => {
|
||||||
|
const formDataWithActualTypes = {
|
||||||
|
...formData,
|
||||||
|
comparison_type: ComparisionType.Values,
|
||||||
|
time_compare: ['1 month ago', '1 month later'],
|
||||||
|
};
|
||||||
|
expect(isDerivedSeries(series, formDataWithActualTypes)).toEqual(true);
|
||||||
|
});
|
||||||
|
|
||||||
|
test('should be false if series name does not match time_compare', () => {
|
||||||
|
const arbitrary_series = {
|
||||||
|
id: 'arbitrary column',
|
||||||
|
name: 'arbitrary column',
|
||||||
|
data: [100],
|
||||||
|
};
|
||||||
|
const formDataWithActualTypes = {
|
||||||
|
...formData,
|
||||||
|
comparison_type: ComparisionType.Values,
|
||||||
|
time_compare: ['1 month ago', '1 month later'],
|
||||||
|
};
|
||||||
|
expect(isDerivedSeries(arbitrary_series, formDataWithActualTypes)).toEqual(
|
||||||
|
false,
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
|
test('should be false if time compare is not suffix', () => {
|
||||||
|
const series = {
|
||||||
|
id: '1 month ago__metric',
|
||||||
|
name: '1 month ago__metric',
|
||||||
|
data: [100],
|
||||||
|
};
|
||||||
|
const formDataWithActualTypes = {
|
||||||
|
...formData,
|
||||||
|
comparison_type: ComparisionType.Values,
|
||||||
|
time_compare: ['1 month ago', '1 month later'],
|
||||||
|
};
|
||||||
|
expect(isDerivedSeries(series, formDataWithActualTypes)).toEqual(false);
|
||||||
|
});
|
||||||
|
|
||||||
|
test('should be false if series name invalid', () => {
|
||||||
|
const series = {
|
||||||
|
id: 123,
|
||||||
|
name: 123,
|
||||||
|
data: [100],
|
||||||
|
};
|
||||||
|
const formDataWithActualTypes = {
|
||||||
|
...formData,
|
||||||
|
comparison_type: ComparisionType.Values,
|
||||||
|
time_compare: ['1 month ago', '1 month later'],
|
||||||
|
};
|
||||||
|
expect(isDerivedSeries(series, formDataWithActualTypes)).toEqual(false);
|
||||||
|
});
|
|
@ -31,7 +31,9 @@ import {
|
||||||
isTimeseriesAnnotationLayer,
|
isTimeseriesAnnotationLayer,
|
||||||
TimeseriesChartDataResponseResult,
|
TimeseriesChartDataResponseResult,
|
||||||
} from '@superset-ui/core';
|
} from '@superset-ui/core';
|
||||||
|
import { isDerivedSeries } from '@superset-ui/chart-controls';
|
||||||
import { EChartsCoreOption, SeriesOption } from 'echarts';
|
import { EChartsCoreOption, SeriesOption } from 'echarts';
|
||||||
|
import { ZRLineType } from 'echarts/types/src/util/types';
|
||||||
import {
|
import {
|
||||||
DEFAULT_FORM_DATA,
|
DEFAULT_FORM_DATA,
|
||||||
EchartsTimeseriesChartProps,
|
EchartsTimeseriesChartProps,
|
||||||
|
@ -181,6 +183,9 @@ export default function transformProps(
|
||||||
}
|
}
|
||||||
|
|
||||||
rawSeries.forEach(entry => {
|
rawSeries.forEach(entry => {
|
||||||
|
const lineStyle = isDerivedSeries(entry, chartProps.rawFormData)
|
||||||
|
? { type: 'dashed' as ZRLineType }
|
||||||
|
: {};
|
||||||
const transformedSeries = transformSeries(entry, colorScale, {
|
const transformedSeries = transformSeries(entry, colorScale, {
|
||||||
area,
|
area,
|
||||||
filterState,
|
filterState,
|
||||||
|
@ -199,6 +204,7 @@ export default function transformProps(
|
||||||
richTooltip,
|
richTooltip,
|
||||||
sliceId,
|
sliceId,
|
||||||
isHorizontal,
|
isHorizontal,
|
||||||
|
lineStyle,
|
||||||
});
|
});
|
||||||
if (transformedSeries) series.push(transformedSeries);
|
if (transformedSeries) series.push(transformedSeries);
|
||||||
});
|
});
|
||||||
|
|
|
@ -87,6 +87,7 @@ export function transformSeries(
|
||||||
seriesKey?: OptionName;
|
seriesKey?: OptionName;
|
||||||
sliceId?: number;
|
sliceId?: number;
|
||||||
isHorizontal?: boolean;
|
isHorizontal?: boolean;
|
||||||
|
lineStyle?: LineStyleOption;
|
||||||
},
|
},
|
||||||
): SeriesOption | undefined {
|
): SeriesOption | undefined {
|
||||||
const { name } = series;
|
const { name } = series;
|
||||||
|
@ -183,8 +184,8 @@ export function transformSeries(
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
const lineStyle = isConfidenceBand
|
const lineStyle = isConfidenceBand
|
||||||
? { opacity: OpacityEnum.Transparent }
|
? { ...opts.lineStyle, opacity: OpacityEnum.Transparent }
|
||||||
: { opacity };
|
: { ...opts.lineStyle, opacity };
|
||||||
return {
|
return {
|
||||||
...series,
|
...series,
|
||||||
yAxisIndex,
|
yAxisIndex,
|
||||||
|
|
Loading…
Reference in New Issue