diff --git a/packages/@ourworldindata/grapher/src/chart/ChartInterface.ts b/packages/@ourworldindata/grapher/src/chart/ChartInterface.ts index b99f3d1b578..3633c46bd00 100644 --- a/packages/@ourworldindata/grapher/src/chart/ChartInterface.ts +++ b/packages/@ourworldindata/grapher/src/chart/ChartInterface.ts @@ -31,6 +31,7 @@ export interface ChartInterface { // Todo: should all charts additionally have a placedSeries: ChartPlacedSeries[] getter? transformTable: ChartTableTransformer + transformTableForDisplay?: ChartTableTransformer yAxis?: HorizontalAxis | VerticalAxis xAxis?: HorizontalAxis | VerticalAxis diff --git a/packages/@ourworldindata/grapher/src/core/Grapher.tsx b/packages/@ourworldindata/grapher/src/core/Grapher.tsx index 796c707b348..ee0db93d4c9 100644 --- a/packages/@ourworldindata/grapher/src/core/Grapher.tsx +++ b/packages/@ourworldindata/grapher/src/core/Grapher.tsx @@ -653,6 +653,15 @@ export class Grapher return this.xAxis.toObject() } + // table that is used for display in the table tab + @computed get tableForDisplay(): OwidTable { + const table = this.table + if (!this.isReady || !this.isOnTableTab) return table + return this.chartInstance.transformTableForDisplay + ? this.chartInstance.transformTableForDisplay(table) + : table + } + @computed get tableForSelection(): OwidTable { // This table specifies which entities can be selected in the charts EntitySelectorModal. // It should contain all entities that can be selected, and none more. diff --git a/packages/@ourworldindata/grapher/src/dataTable/DataTable.tsx b/packages/@ourworldindata/grapher/src/dataTable/DataTable.tsx index 8f55934ae5a..afdf2e77349 100644 --- a/packages/@ourworldindata/grapher/src/dataTable/DataTable.tsx +++ b/packages/@ourworldindata/grapher/src/dataTable/DataTable.tsx @@ -77,7 +77,8 @@ const inverseSortOrder = (order: SortOrder): SortOrder => order === SortOrder.asc ? SortOrder.desc : SortOrder.asc export interface DataTableManager { - table: OwidTable + table: OwidTable // not used here, but required in type `ChartManager` + tableForDisplay: OwidTable entityType?: string endTime?: Time startTime?: Time @@ -131,7 +132,7 @@ export class DataTable extends React.Component<{ } @computed get table(): OwidTable { - let table = this.manager.table + let table = this.manager.tableForDisplay if (this.manager.showSelectionOnlyInDataTable) { table = table.filterByEntityNames( this.selectionArray.selectedEntityNames @@ -144,6 +145,7 @@ export class DataTable extends React.Component<{ return ( this.props.manager ?? { table: BlankOwidTable(), + tableForDisplay: BlankOwidTable(), entityType: DEFAULT_GRAPHER_ENTITY_TYPE, } ) diff --git a/packages/@ourworldindata/grapher/src/scatterCharts/ScatterPlotChart.tsx b/packages/@ourworldindata/grapher/src/scatterCharts/ScatterPlotChart.tsx index 2e528a34539..4ecd3111312 100644 --- a/packages/@ourworldindata/grapher/src/scatterCharts/ScatterPlotChart.tsx +++ b/packages/@ourworldindata/grapher/src/scatterCharts/ScatterPlotChart.tsx @@ -265,6 +265,22 @@ export class ScatterPlotChart return table } + transformTableForDisplay(table: OwidTable): OwidTable { + // Drop any rows which have non-number values for X or Y. + table = table + .columnFilter( + this.xColumnSlug, + isNumber, + "Drop rows with non-number values in X column" + ) + .columnFilter( + this.yColumnSlug, + isNumber, + "Drop rows with non-number values in Y column" + ) + return table + } + @computed get inputTable(): OwidTable { return this.manager.table }