diff --git a/superset-frontend/temporary_superset_ui/superset-ui/plugins/plugin-chart-echarts/src/BoxPlot/EchartsBoxPlot.tsx b/superset-frontend/temporary_superset_ui/superset-ui/plugins/plugin-chart-echarts/src/BoxPlot/EchartsBoxPlot.tsx index 5e7370cad16..f13396d096b 100644 --- a/superset-frontend/temporary_superset_ui/superset-ui/plugins/plugin-chart-echarts/src/BoxPlot/EchartsBoxPlot.tsx +++ b/superset-frontend/temporary_superset_ui/superset-ui/plugins/plugin-chart-echarts/src/BoxPlot/EchartsBoxPlot.tsx @@ -74,7 +74,7 @@ export default function EchartsBoxPlot({ if (values.includes(name)) { handleChange(values.filter(v => v !== name)); } else { - handleChange([...values, name]); + handleChange([name]); } }, }; diff --git a/superset-frontend/temporary_superset_ui/superset-ui/plugins/plugin-chart-echarts/src/BoxPlot/transformProps.ts b/superset-frontend/temporary_superset_ui/superset-ui/plugins/plugin-chart-echarts/src/BoxPlot/transformProps.ts index 420287c7a9b..ad16c2b54d3 100644 --- a/superset-frontend/temporary_superset_ui/superset-ui/plugins/plugin-chart-echarts/src/BoxPlot/transformProps.ts +++ b/superset-frontend/temporary_superset_ui/superset-ui/plugins/plugin-chart-echarts/src/BoxPlot/transformProps.ts @@ -32,6 +32,7 @@ import { } from './types'; import { extractGroupbyLabel, getColtypesMapping, sanitizeHtml } from '../utils/series'; import { defaultGrid, defaultTooltip, defaultYAxis } from '../defaults'; +import { OpacityEnum } from '../constants'; export default function transformProps( chartProps: EchartsBoxPlotChartProps, @@ -63,6 +64,7 @@ export default function transformProps( }); return metricLabels.map(metric => { const name = metricLabels.length === 1 ? groupbyLabel : `${groupbyLabel}, ${metric}`; + const isFiltered = filterState.selectedValues && !filterState.selectedValues.includes(name); return { name, value: [ @@ -77,7 +79,7 @@ export default function transformProps( ], itemStyle: { color: colorFn(groupbyLabel), - opacity: 0.6, + opacity: isFiltered ? OpacityEnum.SemiTransparent : 0.6, borderColor: colorFn(groupbyLabel), }, }; @@ -96,6 +98,7 @@ export default function transformProps( const name = metricLabels.length === 1 ? groupbyLabel : `${groupbyLabel}, ${metric}`; // Outlier data is a nested array of numbers (uncommon, therefore no need to add to DataRecordValue) const outlierDatum = (datum[`${metric}__outliers`] || []) as number[]; + const isFiltered = filterState.selectedValues && !filterState.selectedValues.includes(name); return { name: 'outlier', type: 'scatter', @@ -111,6 +114,7 @@ export default function transformProps( }, itemStyle: { color: colorFn(groupbyLabel), + opacity: isFiltered ? OpacityEnum.SemiTransparent : OpacityEnum.NonTransparent, }, }; }),