diff --git a/src/shared/components/plots/MultipleCategoryBarPlot.tsx b/src/shared/components/plots/MultipleCategoryBarPlot.tsx index 8980b3d9c1e..de8235ae206 100644 --- a/src/shared/components/plots/MultipleCategoryBarPlot.tsx +++ b/src/shared/components/plots/MultipleCategoryBarPlot.tsx @@ -439,7 +439,8 @@ export default class MultipleCategoryBarPlot extends React.Component< ) { return getSortedMajorCategories( this.data, - this.props.sortByOption + this.props.sortByOption, + !!this.props.percentage ); } return sortDataByCategory( diff --git a/src/shared/components/plots/MultipleCategoryBarPlotUtils.ts b/src/shared/components/plots/MultipleCategoryBarPlotUtils.ts index 646ff9256c3..aa6c69c0a13 100644 --- a/src/shared/components/plots/MultipleCategoryBarPlotUtils.ts +++ b/src/shared/components/plots/MultipleCategoryBarPlotUtils.ts @@ -105,7 +105,8 @@ export function sortDataByCategory( } export function getSortedMajorCategories( data: IMultipleCategoryBarPlotData[], - sortByOption: string + sortByOption: string, + sortByPercentage: boolean ): string[] { if (sortByOption === 'SortByTotalSum') { const majorCategoryCounts: { [key: string]: number } = {}; @@ -130,8 +131,13 @@ export function getSortedMajorCategories( item => item.minorCategory === sortByOption ); if (sortedEntityData) { - sortedEntityData.counts.sort((a, b) => b.percentage - a.percentage); - + if (sortByPercentage) { + sortedEntityData.counts.sort( + (a, b) => b.percentage - a.percentage + ); + } else { + sortedEntityData.counts.sort((a, b) => b.count - a.count); + } return sortedEntityData.counts.map(item => item.majorCategory); } } @@ -140,9 +146,14 @@ export function getSortedMajorCategories( } export function sortDataByOption( data: IMultipleCategoryBarPlotData[], - sortByOption: string + sortByOption: string, + sortByPercentage: boolean ): IMultipleCategoryBarPlotData[] { - const sortedMajorCategories = getSortedMajorCategories(data, sortByOption); + const sortedMajorCategories = getSortedMajorCategories( + data, + sortByOption, + sortByPercentage + ); if (sortByOption === 'SortByTotalSum' || sortedMajorCategories.length > 0) { const reorderCounts = (counts: CountItem[]): CountItem[] => { @@ -202,7 +213,7 @@ export function makeBarSpecs( sortByOption !== '' && sortByOption !== SortByOptions.Alphabetically ) { - data = sortDataByOption(data, sortByOption); + data = sortDataByOption(data, sortByOption, percentage); } else { // one bar spec per minor category, in correct order - either specified, or alphabetical data = sortDataByCategory( diff --git a/src/shared/components/plots/PlotsTab.tsx b/src/shared/components/plots/PlotsTab.tsx index 3fabcf83a0e..5cbdc3a8c8a 100644 --- a/src/shared/components/plots/PlotsTab.tsx +++ b/src/shared/components/plots/PlotsTab.tsx @@ -4601,36 +4601,38 @@ export default class PlotsTab extends React.Component { )} - {this.discreteVsDiscretePlotType == 'StackedBar' && ( -
- -
- -
-
- )} {showStackedBarHorizontalOption && ( -
- -
+ <> +
+ +
+ +
+
+
+ +
+ )} {showRegression && (