Archives/gristlabs_grist-core
1
0
Fork 0
mirror of https://github.com/gristlabs/grist-core.git synced 2024-10-27 20:44:07 +00:00
Code Issues Projects Releases Wiki Activity

(core) Replace nulls in X-axis of charts with '-' to avoid confusion with missing points

Browse Source 
Summary:
Seem in a customer doc where Y-scale was wrong for unclear reasons. The cause
is that null-valued X labels cause the corresponding bar (or point) to be
omitted, but still affect the Y-scale. In this diff, such labels are replaced
with "-", so as to show up normally.

Trivial example that reproduces the problem here:
https://public.getgrist.com/iLPpx9C5i8nk/Null-in-X-Axis

Test Plan: Tested manually.

Reviewers: cyprien

Reviewed By: cyprien

Subscribers: cyprien

Differential Revision: https://phab.getgrist.com/D3442
This commit is contained in:
Dmitry S 2022-05-19 14:56:06 -04:00
parent 8f4f21e94a
commit 9bc04a6e66
1 changed files with 14 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
app/client/components/ChartView.ts
View File

@ -1045,7 +1045,7 @@ function basicPlot(series: Series[], options: ChartOptions, dataOptions: Data):
const dataSeries = series.slice(1).map((line: Series): Data => ({ const dataSeries = series.slice(1).map((line: Series): Data => ({
name: getSeriesName(line, series.length > 2), name: getSeriesName(line, series.length > 2),
[axis1]: series[0].values, [axis1]: replaceEmptyLabels(series[0].values),
[axis2]: line.values, [axis2]: line.values,
[`error_${axis2}`]: errorBars.get(line), [`error_${axis2}`]: errorBars.get(line),
orientation: options.orientation, orientation: options.orientation,
@ -1129,7 +1129,7 @@ export const chartTypes: {[name: string]: ChartFunc} = {
name: getSeriesName(line, false), name: getSeriesName(line, false),
// nulls cause JS errors when pie charts resize, so replace with blanks. // nulls cause JS errors when pie charts resize, so replace with blanks.
// (a falsy value would cause plotly to show its index, like "2" which is more confusing). // (a falsy value would cause plotly to show its index, like "2" which is more confusing).
labels: series[0].values.map(v => (v == null || v === "") ? "-" : v), labels: replaceEmptyLabels(series[0].values),
values: line.values, values: line.values,
...dataOptions, ...dataOptions,
}] }]
@ -1202,6 +1202,18 @@ function trimNonNumericData(series: Series[]): void {
} }
} }
/**
* Replace empty values with "-", which is relevant for labels in Pie Charts and for X-axis in
* other chart types.
*
* In pie charts, nulls cause JS errors. In other types, nulls in X-axis cause that point to be
* omitted (but still affect the Y scale, causing confusion). Replace with "-" rather than blank
* because plotly replaces falsy values by their index (eg "2") in Pie charts, which is confusing.
*/
function replaceEmptyLabels(values: Datum[]): Datum[] {
return values.map(v => (v == null || v === "") ? "-" : v);
}
// Given two parallel arrays, returns an array of series of the form // Given two parallel arrays, returns an array of series of the form
// {label: category, values: array-of-values} // {label: category, values: array-of-values}
function groupIntoSeries(categoryList: Datum[], valueList: Datum[]): Series[] { function groupIntoSeries(categoryList: Datum[], valueList: Datum[]): Series[] {