IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-03 12:11:09 -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": [
[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.", "2"]
[0, 0, 0, "Do not use any type assertions.", "1"]
],
"packages/grafana-ui/src/components/uPlot/PlotLegend.tsx:5381": [
[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 {},
"legend": Object {
"show": false,
},
"mode": 1,
"padding": undefined,
"ms": 1,
"padding": Array [
[Function],
[Function],
[Function],
[Function],
],
"scales": Object {
"__fixed/na-na/na-na/auto/linear/na": Object {
"auto": true,

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

@ -222,6 +222,7 @@ export const preparePlotConfigBuilder: UPlotConfigPrepFn<{
softMin: customConfig.axisSoftMin,
softMax: customConfig.axisSoftMax,
centeredZero: customConfig.axisCenteredZero,
range: customConfig.stacking?.mode === StackingMode.Percent ? [0, 1] : undefined,
},
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 { PlotProps } from './types';
import { DEFAULT_PLOT_CONFIG, pluginLog } from './utils';
import { pluginLog } from './utils';
function sameDims(prevProps: PlotProps, nextProps: PlotProps) {
return nextProps.width === prevProps.width && nextProps.height === prevProps.height;
@ -65,10 +65,8 @@ export class UPlotChart extends Component<PlotProps, UPlotChartState> {
});
const config: Options = {
...DEFAULT_PLOT_CONFIG,
width: this.props.width,
height: this.props.height,
ms: 1 as 1,
...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],
},
},
"focus": Object {
"alpha": 1,
},
"hooks": Object {},
"legend": Object {
"show": false,
},
"mode": 1,
"padding": undefined,
"ms": 1,
"padding": Array [
[Function],
[Function],
[Function],
[Function],
],
"scales": Object {},
"select": undefined,
"series": Array [
@ -88,9 +100,21 @@ describe('UPlotConfigBuilder', () => {
"width": [Function],
},
},
"focus": Object {
"alpha": 1,
},
"hooks": Object {},
"legend": Object {
"show": false,
},
"mode": 1,
"padding": undefined,
"ms": 1,
"padding": Array [
[Function],
[Function],
[Function],
[Function],
],
"scales": Object {
"scale-x": Object {
"auto": false,
@ -168,9 +192,21 @@ describe('UPlotConfigBuilder', () => {
"width": [Function],
},
},
"focus": Object {
"alpha": 1,
},
"hooks": Object {},
"legend": Object {
"show": false,
},
"mode": 1,
"padding": undefined,
"ms": 1,
"padding": Array [
[Function],
[Function],
[Function],
[Function],
],
"scales": Object {
"scale-y": Object {
"auto": true,
@ -221,9 +257,21 @@ describe('UPlotConfigBuilder', () => {
"width": [Function],
},
},
"focus": Object {
"alpha": 1,
},
"hooks": Object {},
"legend": Object {
"show": false,
},
"mode": 1,
"padding": undefined,
"ms": 1,
"padding": Array [
[Function],
[Function],
[Function],
[Function],
],
"scales": Object {
"scale-y": Object {
"auto": true,
@ -275,9 +323,21 @@ describe('UPlotConfigBuilder', () => {
"width": [Function],
},
},
"focus": Object {
"alpha": 1,
},
"hooks": Object {},
"legend": Object {
"show": false,
},
"mode": 1,
"padding": undefined,
"ms": 1,
"padding": Array [
[Function],
[Function],
[Function],
[Function],
],
"scales": Object {
"scale-y": Object {
"auto": true,
@ -394,9 +454,21 @@ describe('UPlotConfigBuilder', () => {
"width": [Function],
},
},
"focus": Object {
"alpha": 1,
},
"hooks": Object {},
"legend": Object {
"show": false,
},
"mode": 1,
"padding": undefined,
"ms": 1,
"padding": Array [
[Function],
[Function],
[Function],
[Function],
],
"scales": Object {},
"select": undefined,
"series": Array [
@ -513,9 +585,21 @@ describe('UPlotConfigBuilder', () => {
"width": [Function],
},
},
"focus": Object {
"alpha": 1,
},
"hooks": Object {},
"legend": Object {
"show": false,
},
"mode": 1,
"padding": undefined,
"ms": 1,
"padding": Array [
[Function],
[Function],
[Function],
[Function],
],
"scales": Object {},
"select": undefined,
"series": Array [
@ -628,9 +712,21 @@ describe('UPlotConfigBuilder', () => {
"width": [Function],
},
},
"focus": Object {
"alpha": 1,
},
"hooks": Object {},
"legend": Object {
"show": false,
},
"mode": 1,
"padding": undefined,
"ms": 1,
"padding": Array [
[Function],
[Function],
[Function],
[Function],
],
"scales": Object {},
"select": undefined,
"series": Array [

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

@ -14,7 +14,7 @@ import {
import { AxisPlacement } from '@grafana/schema';
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 { ScaleProps, UPlotScaleBuilder } from './UPlotScaleBuilder';
@ -191,6 +191,7 @@ export class UPlotConfigBuilder {
getConfig() {
const config: PlotConfig = {
...DEFAULT_PLOT_CONFIG,
mode: this.mode,
series: [
this.mode === 2
@ -238,7 +239,10 @@ export class UPlotConfigBuilder {
);
config.tzDate = this.tzDate;
config.padding = this.padding;
if (Array.isArray(this.padding)) {
config.padding = this.padding;
}
if (this.stackingGroups.length) {
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> = {
ms: 1,
focus: {
alpha: 1,
},

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

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