IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

TimeSeries: fix padding, force 0-100% y range when % stacked (#54197)

Browse Source
This commit is contained in:
Leon Sorokin 2022-09-02 09:26:04 -05:00 committed by GitHub
parent 3e8d178fc1
commit 28426219ce
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
8 changed files with 231 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
.betterer.results
View File

@ -1816,8 +1816,7 @@ exports[`better eslint`] = {
], ],
"packages/grafana-ui/src/components/uPlot/Plot.tsx:5381": [ "packages/grafana-ui/src/components/uPlot/Plot.tsx:5381": [
[0, 0, 0, "Do not use any type assertions.", "0"], [0, 0, 0, "Do not use any type assertions.", "0"],
[0, 0, 0, "Do not use any type assertions.", "1"], [0, 0, 0, "Do not use any type assertions.", "1"]
[0, 0, 0, "Do not use any type assertions.", "2"]
], ],
"packages/grafana-ui/src/components/uPlot/PlotLegend.tsx:5381": [ "packages/grafana-ui/src/components/uPlot/PlotLegend.tsx:5381": [
[0, 0, 0, "Unexpected any. Specify a different type.", "0"], [0, 0, 0, "Unexpected any. Specify a different type.", "0"],

14
packages/grafana-ui/src/components/GraphNG/__snapshots__/utils.test.ts.snap
View File

@ -83,9 +83,21 @@ Object {
], ],
}, },
}, },
"focus": Object {
"alpha": 1,
},
"hooks": Object {}, "hooks": Object {},
"legend": Object {
"show": false,
},
"mode": 1, "mode": 1,
"padding": undefined, "ms": 1,
"padding": Array [
[Function],
[Function],
[Function],
[Function],
],
"scales": Object { "scales": Object {
"__fixed/na-na/na-na/auto/linear/na": Object { "__fixed/na-na/na-na/auto/linear/na": Object {
"auto": true, "auto": true,

1
packages/grafana-ui/src/components/TimeSeries/utils.ts
View File

@ -222,6 +222,7 @@ export const preparePlotConfigBuilder: UPlotConfigPrepFn<{
softMin: customConfig.axisSoftMin, softMin: customConfig.axisSoftMin,
softMax: customConfig.axisSoftMax, softMax: customConfig.axisSoftMax,
centeredZero: customConfig.axisCenteredZero, centeredZero: customConfig.axisCenteredZero,
range: customConfig.stacking?.mode === StackingMode.Percent ? [0, 1] : undefined,
}, },
field field
) )

4
packages/grafana-ui/src/components/uPlot/Plot.tsx
View File

@ -2,7 +2,7 @@ import React, { Component, createRef } from 'react';
import uPlot, { AlignedData, Options } from 'uplot'; import uPlot, { AlignedData, Options } from 'uplot';
import { PlotProps } from './types'; import { PlotProps } from './types';
import { DEFAULT_PLOT_CONFIG, pluginLog } from './utils'; import { pluginLog } from './utils';
function sameDims(prevProps: PlotProps, nextProps: PlotProps) { function sameDims(prevProps: PlotProps, nextProps: PlotProps) {
return nextProps.width === prevProps.width && nextProps.height === prevProps.height; return nextProps.width === prevProps.width && nextProps.height === prevProps.height;
@ -65,10 +65,8 @@ export class UPlotChart extends Component<PlotProps, UPlotChartState> {
}); });
const config: Options = { const config: Options = {
...DEFAULT_PLOT_CONFIG,
width: this.props.width, width: this.props.width,
height: this.props.height, height: this.props.height,
ms: 1 as 1,
...this.props.config.getConfig(), ...this.props.config.getConfig(),
}; };

112
packages/grafana-ui/src/components/uPlot/config/UPlotConfigBuilder.test.ts
View File

@ -37,9 +37,21 @@ describe('UPlotConfigBuilder', () => {
"width": [Function], "width": [Function],
}, },
}, },
"focus": Object {
"alpha": 1,
},
"hooks": Object {}, "hooks": Object {},
"legend": Object {
"show": false,
},
"mode": 1, "mode": 1,
"padding": undefined, "ms": 1,
"padding": Array [
[Function],
[Function],
[Function],
[Function],
],
"scales": Object {}, "scales": Object {},
"select": undefined, "select": undefined,
"series": Array [ "series": Array [
@ -88,9 +100,21 @@ describe('UPlotConfigBuilder', () => {
"width": [Function], "width": [Function],
}, },
}, },
"focus": Object {
"alpha": 1,
},
"hooks": Object {}, "hooks": Object {},
"legend": Object {
"show": false,
},
"mode": 1, "mode": 1,
"padding": undefined, "ms": 1,
"padding": Array [
[Function],
[Function],
[Function],
[Function],
],
"scales": Object { "scales": Object {
"scale-x": Object { "scale-x": Object {
"auto": false, "auto": false,
@ -168,9 +192,21 @@ describe('UPlotConfigBuilder', () => {
"width": [Function], "width": [Function],
}, },
}, },
"focus": Object {
"alpha": 1,
},
"hooks": Object {}, "hooks": Object {},
"legend": Object {
"show": false,
},
"mode": 1, "mode": 1,
"padding": undefined, "ms": 1,
"padding": Array [
[Function],
[Function],
[Function],
[Function],
],
"scales": Object { "scales": Object {
"scale-y": Object { "scale-y": Object {
"auto": true, "auto": true,
@ -221,9 +257,21 @@ describe('UPlotConfigBuilder', () => {
"width": [Function], "width": [Function],
}, },
}, },
"focus": Object {
"alpha": 1,
},
"hooks": Object {}, "hooks": Object {},
"legend": Object {
"show": false,
},
"mode": 1, "mode": 1,
"padding": undefined, "ms": 1,
"padding": Array [
[Function],
[Function],
[Function],
[Function],
],
"scales": Object { "scales": Object {
"scale-y": Object { "scale-y": Object {
"auto": true, "auto": true,
@ -275,9 +323,21 @@ describe('UPlotConfigBuilder', () => {
"width": [Function], "width": [Function],
}, },
}, },
"focus": Object {
"alpha": 1,
},
"hooks": Object {}, "hooks": Object {},
"legend": Object {
"show": false,
},
"mode": 1, "mode": 1,
"padding": undefined, "ms": 1,
"padding": Array [
[Function],
[Function],
[Function],
[Function],
],
"scales": Object { "scales": Object {
"scale-y": Object { "scale-y": Object {
"auto": true, "auto": true,
@ -394,9 +454,21 @@ describe('UPlotConfigBuilder', () => {
"width": [Function], "width": [Function],
}, },
}, },
"focus": Object {
"alpha": 1,
},
"hooks": Object {}, "hooks": Object {},
"legend": Object {
"show": false,
},
"mode": 1, "mode": 1,
"padding": undefined, "ms": 1,
"padding": Array [
[Function],
[Function],
[Function],
[Function],
],
"scales": Object {}, "scales": Object {},
"select": undefined, "select": undefined,
"series": Array [ "series": Array [
@ -513,9 +585,21 @@ describe('UPlotConfigBuilder', () => {
"width": [Function], "width": [Function],
}, },
}, },
"focus": Object {
"alpha": 1,
},
"hooks": Object {}, "hooks": Object {},
"legend": Object {
"show": false,
},
"mode": 1, "mode": 1,
"padding": undefined, "ms": 1,
"padding": Array [
[Function],
[Function],
[Function],
[Function],
],
"scales": Object {}, "scales": Object {},
"select": undefined, "select": undefined,
"series": Array [ "series": Array [
@ -628,9 +712,21 @@ describe('UPlotConfigBuilder', () => {
"width": [Function], "width": [Function],
}, },
}, },
"focus": Object {
"alpha": 1,
},
"hooks": Object {}, "hooks": Object {},
"legend": Object {
"show": false,
},
"mode": 1, "mode": 1,
"padding": undefined, "ms": 1,
"padding": Array [
[Function],
[Function],
[Function],
[Function],
],
"scales": Object {}, "scales": Object {},
"select": undefined, "select": undefined,
"series": Array [ "series": Array [

6
packages/grafana-ui/src/components/uPlot/config/UPlotConfigBuilder.ts
View File

@ -14,7 +14,7 @@ import {
import { AxisPlacement } from '@grafana/schema'; import { AxisPlacement } from '@grafana/schema';
import { FacetedData, PlotConfig, PlotTooltipInterpolator } from '../types'; import { FacetedData, PlotConfig, PlotTooltipInterpolator } from '../types';
import { getStackingBands, pluginLog, StackingGroup } from '../utils'; import { DEFAULT_PLOT_CONFIG, getStackingBands, pluginLog, StackingGroup } from '../utils';
import { AxisProps, UPlotAxisBuilder } from './UPlotAxisBuilder'; import { AxisProps, UPlotAxisBuilder } from './UPlotAxisBuilder';
import { ScaleProps, UPlotScaleBuilder } from './UPlotScaleBuilder'; import { ScaleProps, UPlotScaleBuilder } from './UPlotScaleBuilder';
@ -191,6 +191,7 @@ export class UPlotConfigBuilder {
getConfig() { getConfig() {
const config: PlotConfig = { const config: PlotConfig = {
...DEFAULT_PLOT_CONFIG,
mode: this.mode, mode: this.mode,
series: [ series: [
this.mode === 2 this.mode === 2
@ -238,7 +239,10 @@ export class UPlotConfigBuilder {
); );
config.tzDate = this.tzDate; config.tzDate = this.tzDate;
if (Array.isArray(this.padding)) {
config.padding = this.padding; config.padding = this.padding;
}
if (this.stackingGroups.length) { if (this.stackingGroups.length) {
this.stackingGroups.forEach((group) => { this.stackingGroups.forEach((group) => {

1
packages/grafana-ui/src/components/uPlot/utils.ts
View File

@ -20,6 +20,7 @@ const paddingSide: PaddingSide = (u, side, sidesWithAxes) => {
}; };
export const DEFAULT_PLOT_CONFIG: Partial<Options> = { export const DEFAULT_PLOT_CONFIG: Partial<Options> = {
ms: 1,
focus: { focus: {
alpha: 1, alpha: 1,
}, },

112
public/app/plugins/panel/barchart/__snapshots__/utils.test.ts.snap
View File

@ -78,6 +78,9 @@ Object {
"x": false, "x": false,
"y": false, "y": false,
}, },
"focus": Object {
"alpha": 1,
},
"hooks": Object { "hooks": Object {
"draw": Array [ "draw": Array [
[Function], [Function],
@ -89,8 +92,17 @@ Object {
[Function], [Function],
], ],
}, },
"legend": Object {
"show": false,
},
"mode": 1, "mode": 1,
"padding": undefined, "ms": 1,
"padding": Array [
[Function],
[Function],
[Function],
[Function],
],
"scales": Object { "scales": Object {
"m/s": Object { "m/s": Object {
"auto": true, "auto": true,
@ -217,6 +229,9 @@ Object {
"x": false, "x": false,
"y": false, "y": false,
}, },
"focus": Object {
"alpha": 1,
},
"hooks": Object { "hooks": Object {
"draw": Array [ "draw": Array [
[Function], [Function],
@ -228,8 +243,17 @@ Object {
[Function], [Function],
], ],
}, },
"legend": Object {
"show": false,
},
"mode": 1, "mode": 1,
"padding": undefined, "ms": 1,
"padding": Array [
[Function],
[Function],
[Function],
[Function],
],
"scales": Object { "scales": Object {
"m/s": Object { "m/s": Object {
"auto": true, "auto": true,
@ -356,6 +380,9 @@ Object {
"x": false, "x": false,
"y": false, "y": false,
}, },
"focus": Object {
"alpha": 1,
},
"hooks": Object { "hooks": Object {
"draw": Array [ "draw": Array [
[Function], [Function],
@ -367,8 +394,17 @@ Object {
[Function], [Function],
], ],
}, },
"legend": Object {
"show": false,
},
"mode": 1, "mode": 1,
"padding": undefined, "ms": 1,
"padding": Array [
[Function],
[Function],
[Function],
[Function],
],
"scales": Object { "scales": Object {
"m/s": Object { "m/s": Object {
"auto": true, "auto": true,
@ -495,6 +531,9 @@ Object {
"x": false, "x": false,
"y": false, "y": false,
}, },
"focus": Object {
"alpha": 1,
},
"hooks": Object { "hooks": Object {
"draw": Array [ "draw": Array [
[Function], [Function],
@ -506,8 +545,17 @@ Object {
[Function], [Function],
], ],
}, },
"legend": Object {
"show": false,
},
"mode": 1, "mode": 1,
"padding": undefined, "ms": 1,
"padding": Array [
[Function],
[Function],
[Function],
[Function],
],
"scales": Object { "scales": Object {
"m/s": Object { "m/s": Object {
"auto": true, "auto": true,
@ -634,6 +682,9 @@ Object {
"x": false, "x": false,
"y": false, "y": false,
}, },
"focus": Object {
"alpha": 1,
},
"hooks": Object { "hooks": Object {
"draw": Array [ "draw": Array [
[Function], [Function],
@ -645,8 +696,17 @@ Object {
[Function], [Function],
], ],
}, },
"legend": Object {
"show": false,
},
"mode": 1, "mode": 1,
"padding": undefined, "ms": 1,
"padding": Array [
[Function],
[Function],
[Function],
[Function],
],
"scales": Object { "scales": Object {
"m/s": Object { "m/s": Object {
"auto": true, "auto": true,
@ -773,6 +833,9 @@ Object {
"x": false, "x": false,
"y": false, "y": false,
}, },
"focus": Object {
"alpha": 1,
},
"hooks": Object { "hooks": Object {
"draw": Array [ "draw": Array [
[Function], [Function],
@ -784,8 +847,17 @@ Object {
[Function], [Function],
], ],
}, },
"legend": Object {
"show": false,
},
"mode": 1, "mode": 1,
"padding": undefined, "ms": 1,
"padding": Array [
[Function],
[Function],
[Function],
[Function],
],
"scales": Object { "scales": Object {
"m/s": Object { "m/s": Object {
"auto": true, "auto": true,
@ -912,6 +984,9 @@ Object {
"x": false, "x": false,
"y": false, "y": false,
}, },
"focus": Object {
"alpha": 1,
},
"hooks": Object { "hooks": Object {
"draw": Array [ "draw": Array [
[Function], [Function],
@ -923,8 +998,17 @@ Object {
[Function], [Function],
], ],
}, },
"legend": Object {
"show": false,
},
"mode": 1, "mode": 1,
"padding": undefined, "ms": 1,
"padding": Array [
[Function],
[Function],
[Function],
[Function],
],
"scales": Object { "scales": Object {
"m/s": Object { "m/s": Object {
"auto": true, "auto": true,
@ -1051,6 +1135,9 @@ Object {
"x": false, "x": false,
"y": false, "y": false,
}, },
"focus": Object {
"alpha": 1,
},
"hooks": Object { "hooks": Object {
"draw": Array [ "draw": Array [
[Function], [Function],
@ -1062,8 +1149,17 @@ Object {
[Function], [Function],
], ],
}, },
"legend": Object {
"show": false,
},
"mode": 1, "mode": 1,
"padding": undefined, "ms": 1,
"padding": Array [
[Function],
[Function],
[Function],
[Function],
],
"scales": Object { "scales": Object {
"m/s": Object { "m/s": Object {
"auto": true, "auto": true,