Skip to content

Commit

Permalink
fix(plugin-chart-echarts): missing value format in mixed timeseries (a…
Browse files Browse the repository at this point in the history
  • Loading branch information
justinpark committed Aug 11, 2022
1 parent bb4ab9b commit f2478c8
Show file tree
Hide file tree
Showing 3 changed files with 141 additions and 2 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,7 @@ import {
MixedTimeseriesTransformProps,
} from '@superset-ui/plugin-chart-echarts';
import data from '../Timeseries/data';
import negativeNumData from './negativeData';
import { withResizableChartDemo } from '../../../../shared/components/ResizableChartDemo';

new EchartsTimeseriesChartPlugin()
Expand All @@ -57,6 +58,8 @@ export const Timeseries = ({ width, height }) => {
Boston: row.Boston,
}))
.filter(row => !!row.Boston),
colnames: ['__timestamp'],
coltypes: [2],
},
{
data: data
Expand All @@ -82,8 +85,13 @@ export const Timeseries = ({ width, height }) => {
logAxis: boolean('Log axis', false),
xAxisTimeFormat: 'smart_date',
tooltipTimeFormat: 'smart_date',
yAxisFormat: 'SMART_NUMBER',
yAxisFormat: select(
'y-axis format',
['$,.2f', 'SMART_NUMBER'],
'$,.2f',
),
yAxisTitle: text('Y Axis title', ''),
yAxisIndexB: select('yAxisIndexB', [0, 1], 1),
minorSplitLine: boolean('Query 1: Minor splitline', false),
seriesType: select(
'Query 1: Line type',
Expand All @@ -105,7 +113,61 @@ export const Timeseries = ({ width, height }) => {
markerEnabledB: boolean('Query 2: Enable markers', false),
markerSizeB: number('Query 2: Marker Size', 6),
opacityB: number('Query 2: Opacity', 0.2),
showValue: true,
}}
/>
);
};

export const WithNegativeNumbers = ({ width, height }) => (
<SuperChart
chartType="mixed-timeseries"
width={width}
height={height}
queriesData={[
{
data: negativeNumData,
colnames: ['__timestamp'],
coltypes: [2],
},
{
data: negativeNumData.map(({ __timestamp, Boston }) => ({
__timestamp,
avgRate: Boston / 100,
})),
},
]}
formData={{
contributionMode: undefined,
colorScheme: 'supersetColors',
seriesType: select(
'Line type',
['line', 'scatter', 'smooth', 'bar', 'start', 'middle', 'end'],
'line',
),
xAxisTimeFormat: 'smart_date',
yAxisFormat: select(
'y-axis format',
{
'Original value': '~g',
'Smart number': 'SMART_NUMBER',
'(12345.432 => $12,345.43)': '$,.2f',
},
'$,.2f',
),
stack: true,
showValue: boolean('Query 1: Show Value', true),
showValueB: boolean('Query 2: Show Value', false),
showLegend: true,
markerEnabledB: true,
yAxisIndexB: select(
'Query 2: Y Axis',
{
Primary: 0,
Secondary: 1,
},
1,
),
}}
/>
);
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
/*
* 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.
*/

export default [
{
__timestamp: 1619827200000,
Boston: 10.8812312312,
Washington: -45.3089432023,
JerseyCity: -23.0509234029834,
},
{
__timestamp: 1622505600000,
Boston: 80.81029340234,
Washington: -10.299023489023,
JerseyCity: 53.54239402349,
},
{
__timestamp: 1625097600000,
Boston: 30.9129034924,
Washington: 100.25234902349,
JerseyCity: 27.17239402394,
},
{
__timestamp: 1627776000000,
Boston: 42.6129034924,
Washington: 90.23234902349,
JerseyCity: -32.23239402394,
},
];
Original file line number Diff line number Diff line change
Expand Up @@ -47,6 +47,8 @@ import {
getAxisType,
getColtypesMapping,
getLegendProps,
extractDataTotalValues,
extractShowValueIndexes,
} from '../utils/series';
import {
extractAnnotationLabels,
Expand Down Expand Up @@ -139,6 +141,7 @@ export default function transformProps(
yAxisTitlePosition,
sliceId,
timeGrainSqla,
percentageThreshold,
}: EchartsMixedTimeseriesFormData = { ...DEFAULT_FORM_DATA, ...formData };

const colorScale = CategoricalColorNamespace.getScale(colorScheme as string);
Expand Down Expand Up @@ -184,7 +187,28 @@ export default function transformProps(
rawSeriesB.forEach(seriesOption =>
mapSeriesIdToAxis(seriesOption, yAxisIndexB),
);

const showValueIndexesA = extractShowValueIndexes(rawSeriesA, {
stack,
});
const showValueIndexesB = extractShowValueIndexes(rawSeriesB, {
stack,
});
const { totalStackedValues, thresholdValues } = extractDataTotalValues(
rebasedDataA,
{
stack,
percentageThreshold,
xAxisCol,
},
);
const {
totalStackedValues: totalStackedValuesB,
thresholdValues: thresholdValuesB,
} = extractDataTotalValues(rebasedDataB, {
stack: Boolean(stackB),
percentageThreshold,
xAxisCol,
});
rawSeriesA.forEach(entry => {
const transformedSeries = transformSeries(entry, colorScale, {
area,
Expand All @@ -198,6 +222,10 @@ export default function transformProps(
filterState,
seriesKey: entry.name,
sliceId,
formatter,
showValueIndexes: showValueIndexesA,
totalStackedValues,
thresholdValues,
});
if (transformedSeries) series.push(transformedSeries);
});
Expand All @@ -217,6 +245,10 @@ export default function transformProps(
? `${entry.name} (1)`
: entry.name,
sliceId,
formatter: formatterSecondary,
showValueIndexes: showValueIndexesB,
totalStackedValues: totalStackedValuesB,
thresholdValues: thresholdValuesB,
});
if (transformedSeries) series.push(transformedSeries);
});
Expand Down

0 comments on commit f2478c8

Please sign in to comment.