From 49f05215e7493dd3d4e93eb8af17444838e61fba Mon Sep 17 00:00:00 2001 From: Sophia Mersmann Date: Fri, 10 Jan 2025 16:40:05 +0100 Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20disallow=20log=20y-scale=20for=20di?= =?UTF-8?q?screte=20bar=20charts?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- adminSiteClient/EditorCustomizeTab.tsx | 56 ++++++++++--------- adminSiteClient/EditorFeatures.tsx | 4 ++ .../src/barCharts/DiscreteBarChart.tsx | 41 +++++--------- .../grapher/src/controls/SettingsMenu.tsx | 11 +++- .../stackedCharts/StackedDiscreteBarChart.tsx | 2 + 5 files changed, 61 insertions(+), 53 deletions(-) diff --git a/adminSiteClient/EditorCustomizeTab.tsx b/adminSiteClient/EditorCustomizeTab.tsx index 9a72f56549b..b8ea6e18b2f 100644 --- a/adminSiteClient/EditorCustomizeTab.tsx +++ b/adminSiteClient/EditorCustomizeTab.tsx @@ -619,19 +619,21 @@ export class EditorCustomizeTab< /> )} - - - (yAxisConfig.canChangeScaleType = - value || undefined) - } - /> - + {features.canEnableLogLinearToggle && ( + + + (yAxisConfig.canChangeScaleType = + value || undefined) + } + /> + + )} )} {features.canCustomizeYAxisLabel && ( @@ -704,19 +706,21 @@ export class EditorCustomizeTab< /> )} - - - (xAxisConfig.canChangeScaleType = - value || undefined) - } - /> - + {features.canEnableLogLinearToggle && ( + + + (xAxisConfig.canChangeScaleType = + value || undefined) + } + /> + + )} )} {features.canCustomizeXAxisLabel && ( diff --git a/adminSiteClient/EditorFeatures.tsx b/adminSiteClient/EditorFeatures.tsx index 243f0a84ffb..d48956c0ecf 100644 --- a/adminSiteClient/EditorFeatures.tsx +++ b/adminSiteClient/EditorFeatures.tsx @@ -47,6 +47,10 @@ export class EditorFeatures { return this.grapher.isScatter } + @computed get canEnableLogLinearToggle() { + return !this.grapher.isDiscreteBar && !this.grapher.isStackedDiscreteBar + } + @computed get timeDomain() { return !this.grapher.isDiscreteBar } diff --git a/packages/@ourworldindata/grapher/src/barCharts/DiscreteBarChart.tsx b/packages/@ourworldindata/grapher/src/barCharts/DiscreteBarChart.tsx index 614f65a8ae2..ece79baf28d 100644 --- a/packages/@ourworldindata/grapher/src/barCharts/DiscreteBarChart.tsx +++ b/packages/@ourworldindata/grapher/src/barCharts/DiscreteBarChart.tsx @@ -123,9 +123,6 @@ export class DiscreteBarChart // TODO: remove this filter once we don't have mixed type columns in datasets table = table.replaceNonNumericCellsWithErrorValues(this.yColumnSlugs) - if (this.isLogScale) - table = table.replaceNonPositiveCellsForLogScale(this.yColumnSlugs) - table = table.dropRowsWithErrorValuesForAllColumns(this.yColumnSlugs) this.yColumnSlugs.forEach((slug) => { @@ -162,10 +159,6 @@ export class DiscreteBarChart return this.manager.endTime } - @computed private get isLogScale(): boolean { - return this.yAxisConfig.scaleType === ScaleType.log - } - @computed private get bounds(): Bounds { return (this.props.bounds ?? DEFAULT_BOUNDS).padRight(10) } @@ -253,10 +246,7 @@ export class DiscreteBarChart } @computed private get x0(): number { - if (!this.isLogScale) return 0 - - const minValue = min(this.series.map((d) => d.value)) - return minValue !== undefined ? Math.min(1, minValue) : 1 + return 0 } // Now we can work out the main x axis scale @@ -294,6 +284,7 @@ export class DiscreteBarChart const axis = this.yAxisConfig.toHorizontalAxis() axis.updateDomainPreservingUserSettings(this.xDomainDefault) + axis.scaleType = ScaleType.linear axis.formatColumn = this.yColumns[0] // todo: does this work for columns as series? axis.range = this.xRange axis.label = "" @@ -520,21 +511,19 @@ export class DiscreteBarChart {this.showColorLegend && ( )} - {!this.isLogScale && ( - - )} + {this.renderBars()} {this.renderValueLabels()} {this.renderEntityLabels()} diff --git a/packages/@ourworldindata/grapher/src/controls/SettingsMenu.tsx b/packages/@ourworldindata/grapher/src/controls/SettingsMenu.tsx index b1d5dca3429..573273f8b37 100644 --- a/packages/@ourworldindata/grapher/src/controls/SettingsMenu.tsx +++ b/packages/@ourworldindata/grapher/src/controls/SettingsMenu.tsx @@ -85,6 +85,7 @@ export interface SettingsMenuManager isOnMapTab?: boolean isOnChartTab?: boolean isOnTableTab?: boolean + isLineChartThatTurnedIntoDiscreteBar?: boolean // linear/log scales yAxis: AxisConfig @@ -121,8 +122,16 @@ export class SettingsMenu extends React.Component<{ @computed get showYScaleToggle(): boolean | undefined { if (this.manager.hideYScaleToggle) return false if (this.manager.isRelativeMode) return false - if ([StackedArea, StackedBar].includes(this.chartType as any)) + if ( + [ + GRAPHER_CHART_TYPES.StackedArea, + GRAPHER_CHART_TYPES.StackedBar, + GRAPHER_CHART_TYPES.DiscreteBar, + GRAPHER_CHART_TYPES.StackedDiscreteBar, + ].includes(this.chartType as any) + ) return false // We currently do not have these charts with log scale + if (this.manager.isLineChartThatTurnedIntoDiscreteBar) return false return this.manager.yAxis.canChangeScaleType } diff --git a/packages/@ourworldindata/grapher/src/stackedCharts/StackedDiscreteBarChart.tsx b/packages/@ourworldindata/grapher/src/stackedCharts/StackedDiscreteBarChart.tsx index a52e26fac37..fb806dc2585 100644 --- a/packages/@ourworldindata/grapher/src/stackedCharts/StackedDiscreteBarChart.tsx +++ b/packages/@ourworldindata/grapher/src/stackedCharts/StackedDiscreteBarChart.tsx @@ -27,6 +27,7 @@ import { ColorSchemeName, FacetStrategy, MissingDataStrategy, + ScaleType, SeriesName, VerticalAlign, } from "@ourworldindata/types" @@ -324,6 +325,7 @@ export class StackedDiscreteBarChart const axis = this.yAxisConfig.toHorizontalAxis() axis.updateDomainPreservingUserSettings(this.xDomainDefault) + axis.scaleType = ScaleType.linear axis.formatColumn = this.yColumns[0] // todo: does this work for columns as series? axis.range = this.xRange axis.label = ""