diff --git a/src/pages/groupComparison/MultipleCategoryBarPlot.tsx b/src/pages/groupComparison/MultipleCategoryBarPlot.tsx index 398700b8772..ebffd23031d 100644 --- a/src/pages/groupComparison/MultipleCategoryBarPlot.tsx +++ b/src/pages/groupComparison/MultipleCategoryBarPlot.tsx @@ -58,7 +58,16 @@ export interface IMultipleCategoryBarPlotProps { svgRef?: (svgContainer: SVGElement | null) => void; pValue: number | null; qValue: number | null; - sortOption: string; + sortOption?: string; +} +export interface TotalSumItem { + majorCategory: string; + sum: number; + minorCategory: { + name: string; + count: number; + percentage: number; + }[]; } export interface IMultipleCategoryBarPlotData { @@ -235,7 +244,6 @@ export default class MultipleCategoryBarPlot extends React.Component< private get legend() { if (this.legendData.length > 0) { - console.log(this.props, 'This.propss'); return ( { + _.forEach(this.data, item => { + // Sorting counts within each item item.counts.sort((a, b) => a.majorCategory.localeCompare(b.majorCategory) ); }); const totalSumArray: TotalSumItem[] = []; - this.data.forEach(item => { - item.counts.forEach(countItem => { - const existingItem = totalSumArray.find( + _.forEach(this.data, item => { + _.forEach(item.counts, countItem => { + const existingItem = _.find( + totalSumArray, sumItem => sumItem.majorCategory === countItem.majorCategory ); if (existingItem) { @@ -471,24 +471,21 @@ export default class MultipleCategoryBarPlot extends React.Component< }); }); - console.log(totalSumArray, 'totalssufrommulti'); totalSumArray.sort((a, b) => b.sum - a.sum); - const labelss = totalSumArray.map(item => item.majorCategory); - console.log(labelss, 'totalsrommulti'); + const sortedLabels = totalSumArray.map(item => item.majorCategory); if (this.props.sortOption == 'sortByCount') { - return labelss; + return sortedLabels; } if (this.data.length > 0) { - const ans = sortDataByCategory( + const CategorizedData = sortDataByCategory( this.data[0].counts.map(c => c.majorCategory), x => x, this.majorCategoryOrder ); - console.log('thisisconsoledataans', ans); - return ans; + return CategorizedData; } else { return []; } @@ -799,7 +796,7 @@ export default class MultipleCategoryBarPlot extends React.Component< !!this.props.horizontalBars, !!this.props.stacked, !!this.props.percentage, - this.props.sortOption + this.props.sortOption || 'sortByAlphabet' ); return barSpecs.map(spec => ( @@ -979,7 +975,6 @@ export default class MultipleCategoryBarPlot extends React.Component< } render() { - console.log(this.data, 'this.datas'); if (!this.data.length) { return
No data to plot.
; } diff --git a/src/shared/components/plots/MultipleCategoryBarPlotUtils.ts b/src/shared/components/plots/MultipleCategoryBarPlotUtils.ts index a4c9314cdf8..a9e36f8f9e0 100644 --- a/src/shared/components/plots/MultipleCategoryBarPlotUtils.ts +++ b/src/shared/components/plots/MultipleCategoryBarPlotUtils.ts @@ -86,14 +86,12 @@ interface TotalSumItem { minorCategory: { name: string; count: number; percentage: number }[]; } -// Export TotalSumItem for accessibility from other modules if needed export { TotalSumItem }; export function sortDataByCategory( data: D[], getCategory: (d: D) => string, categoryOrder: { [cat: string]: number } | undefined ) { - // console.log( TotalSumItem[],"totalSumArray inside sortDataByCategory"); return _.sortBy(data, d => { const category = getCategory(d); if (categoryOrder) { @@ -117,7 +115,7 @@ export function makeBarSpecs( horizontalBars: boolean, stacked: boolean, percentage: boolean, - sortOption: string + sortOption?: string ): { fill: string; data: { @@ -127,28 +125,18 @@ export function makeBarSpecs( minorCategory: string; count: number; percentage: number; - }[]; // one data per major category, in correct order - either specified, or alphabetical + }[]; }[] { - // one bar spec per minor category, in correct order - either specified, or alphabetical data = sortDataByCategory(data, d => d.minorCategory, minorCategoryOrder); - // reverse the order of stacked or horizontal bars if ((!horizontalBars && stacked) || (horizontalBars && !stacked)) { data = _.reverse(data); } - console.log(data, 'iscalled2'); data.forEach(item => { item.counts.sort((a, b) => a.majorCategory.localeCompare(b.majorCategory) ); }); - console.log(data, 'iscalled211'); - - // interface TotalSumItem { - // majorCategory: string; - // sum: number; - // minorCategory: { name: string; count: number ,percentage:number}[]; - // } const totalSumArray: TotalSumItem[] = []; data.forEach(item => { @@ -179,7 +167,6 @@ export function makeBarSpecs( }); }); - console.log(totalSumArray, 'totalssu'); totalSumArray.sort((a, b) => b.sum - a.sum); const minorCategoryArrays: { [key: string]: { @@ -211,7 +198,6 @@ export function makeBarSpecs( }); }); }); - console.log(minorCategoryArrays, 'minorCategoryarrayss'); return data.map(({ minorCategory, counts }) => { const fill = getColor(minorCategory); const sortedCounts = sortDataByCategory( @@ -219,26 +205,18 @@ export function makeBarSpecs( d => d.majorCategory, majorCategoryOrder ); - console.log(counts, majorCategoryOrder, 'kkk'); - console.log(sortedCounts, 'sror'); - // sortedCounts.sort((a, b) => b.count - a.count); - console.log(sortedCounts, 'sorteddsc'); - // console.log(minorCategory,"sorteddsc"); const finals = minorCategoryArrays[minorCategory]; - // console.log(minorCategoryArrays["Male"],"HEREISSS") - // console.log(sortedCounts,"sror") - let ans; - if (sortOption == 'sortByAlphabet') { - ans = sortedCounts; + let categoriezedCounts; + if (sortOption == 'sortByCount') { + categoriezedCounts = finals; } else { - ans = finals; + categoriezedCounts = sortedCounts; } - console.log(sortOption, 'sortOptions'); - const finalans = { + const countByCategory = { fill, - data: ans.map((obj, index) => ({ + data: categoriezedCounts.map((obj, index) => ({ x: categoryCoord(index), y: percentage ? obj.percentage : obj.count, majorCategory: obj.majorCategory, @@ -247,8 +225,7 @@ export function makeBarSpecs( percentage: obj.percentage, })), }; - console.log(finalans, 'iscalled3'); - return finalans; + return countByCategory; }); }