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

XYChart: Fix numerous axis options (#75044)

Browse Source
This commit is contained in:
Leon Sorokin 2023-09-19 14:44:50 -05:00 committed by GitHub
parent e83054386b
commit 780b60dc81
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 29 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -32,11 +32,6 @@ exports[`GraphNG utils preparePlotConfigBuilder 1`] = `
"values": [Function], "values": [Function],
}, },
{ {
"border": {
"show": false,
"stroke": "rgb(204, 204, 220)",
"width": 1,
},
"filter": undefined, "filter": undefined,
"font": "12px "Inter", "Helvetica", "Arial", sans-serif", "font": "12px "Inter", "Helvetica", "Arial", sans-serif",
"gap": 5, "gap": 5,

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

@ -180,8 +180,12 @@ export class UPlotAxisBuilder extends PlotConfigBuilder<AxisProps, Axis> {
incrs, incrs,
}; };
if (border != null) { if (border?.show) {
config.border = border; config.border = {
stroke: color ?? theme.colors.text.primary,
width: 1 / devicePixelRatio,
...border,
};
} }
if (label != null && label.length > 0) { if (label != null && label.length > 0) {

7
packages/grafana-ui/src/options/builder/axis.tsx
View File

@ -65,6 +65,7 @@ export function addAxisConfig(
{ value: false, label: 'Off' }, { value: false, label: 'Off' },
], ],
}, },
showIf: (c) => c.axisPlacement !== AxisPlacement.Hidden,
}) })
.addRadio({ .addRadio({
path: 'axisColorMode', path: 'axisColorMode',
@ -77,12 +78,14 @@ export function addAxisConfig(
{ value: AxisColorMode.Series, label: 'Series' }, { value: AxisColorMode.Series, label: 'Series' },
], ],
}, },
showIf: (c) => c.axisPlacement !== AxisPlacement.Hidden,
}) })
.addBooleanSwitch({ .addBooleanSwitch({
path: 'axisShow', path: 'axisShow', // TODO: rename to axisBorderShow
name: 'Show axis', name: 'Show border',
category, category,
defaultValue: false, defaultValue: false,
showIf: (c) => c.axisPlacement !== AxisPlacement.Hidden,
}); });
// options for scale range // options for scale range

32
public/app/plugins/panel/xychart/scatter.ts
View File

@ -622,6 +622,8 @@ const prepConfig = (
scaleKey: 'x', scaleKey: 'x',
placement: customConfig?.axisPlacement !== AxisPlacement.Hidden ? AxisPlacement.Bottom : AxisPlacement.Hidden, placement: customConfig?.axisPlacement !== AxisPlacement.Hidden ? AxisPlacement.Bottom : AxisPlacement.Hidden,
show: customConfig?.axisPlacement !== AxisPlacement.Hidden, show: customConfig?.axisPlacement !== AxisPlacement.Hidden,
grid: { show: customConfig?.axisGridShow },
border: { show: customConfig?.axisShow },
theme, theme,
label: label:
xAxisLabel == null || xAxisLabel === '' xAxisLabel == null || xAxisLabel === ''
@ -659,21 +661,23 @@ const prepConfig = (
decimals: config.decimals, decimals: config.decimals,
}); });
if (customConfig?.axisPlacement !== AxisPlacement.Hidden) { // why does this fall back to '' instead of null or undef?
// why does this fall back to '' instead of null or undef? let yAxisLabel = customConfig?.axisLabel;
let yAxisLabel = customConfig?.axisLabel;
builder.addAxis({ builder.addAxis({
scaleKey, scaleKey,
theme, theme,
placement: customConfig?.axisPlacement, placement: customConfig?.axisPlacement === AxisPlacement.Auto ? AxisPlacement.Left : customConfig?.axisPlacement,
label: show: customConfig?.axisPlacement !== AxisPlacement.Hidden,
yAxisLabel == null || yAxisLabel === '' grid: { show: customConfig?.axisGridShow },
? getFieldDisplayName(field, scatterSeries[si].frame(frames), frames) border: { show: customConfig?.axisShow },
: yAxisLabel, size: customConfig?.axisWidth,
formatValue: (v, decimals) => formattedValueToString(field.display!(v, decimals)), label:
}); yAxisLabel == null || yAxisLabel === ''
} ? getFieldDisplayName(field, scatterSeries[si].frame(frames), frames)
: yAxisLabel,
formatValue: (v, decimals) => formattedValueToString(field.display!(v, decimals)),
});
builder.addSeries({ builder.addSeries({
facets: [ facets: [