Schema: unify bar/point/etc visibility modes (#39378) (#39446)

(cherry picked from commit ad3c7529b0)

Co-authored-by: Ryan McKinley <ryantxu@gmail.com>
This commit is contained in:
Grot (@grafanabot)
2021-09-20 21:52:52 +02:00
committed by GitHub
co-authored by Ryan McKinley
parent ee7c12592d
commit 9ae43a7aaa
24 changed files with 76 additions and 93 deletions
+2 -3
View File
@@ -1,13 +1,12 @@
package schema
AxisPlacement: "auto" | "top" | "right" | "bottom" | "left" | "hidden" @cuetsy(kind="enum")
PointVisibility: "auto" | "never" | "always" @cuetsy(kind="enum")
VisibilityMode: "auto" | "never" | "always" @cuetsy(kind="enum")
DrawStyle: "line" | "bars" | "points" @cuetsy(kind="enum")
LineInterpolation: "linear" | "smooth" | "stepBefore" | "stepAfter" @cuetsy(kind="enum")
ScaleDistribution: "linear" | "log" @cuetsy(kind="enum")
GraphGradientMode: "none" | "opacity" | "hue" | "scheme" @cuetsy(kind="enum")
StackingMode: "none" | "normal" | "percent" @cuetsy(kind="enum")
BarValueVisibility: "auto" | "never" | "always" @cuetsy(kind="enum")
BarAlignment: -1 | 0 | 1 @cuetsy(kind="enum",memberNames="Before|Center|After")
ScaleOrientation: 0 | 1 @cuetsy(kind="enum",memberNames="Horizontal|Vertical")
ScaleDirection: 1 | 1 | -1 | -1 @cuetsy(kind="enum",memberNames="Up|Right|Down|Left")
@@ -33,7 +32,7 @@ FillConfig: {
fillBelowTo?: string
} @cuetsy(kind="interface")
PointsConfig: {
showPoints?: PointVisibility
showPoints?: VisibilityMode
pointSize?: number
pointColor?: string
pointSymbol?: string
@@ -11,9 +11,9 @@ export enum AxisPlacement {
Right = 'right',
Top = 'top',
}
export enum PointVisibility {
Always = 'always',
export enum VisibilityMode {
Auto = 'auto',
Always = 'always',
Never = 'never',
}
export enum GraphDrawStyle {
@@ -45,12 +45,11 @@ export interface LineStyle {
dash?: number[];
fill?: 'solid' | 'dash' | 'dot' | 'square';
}
export interface PointsConfig {
pointColor?: string;
pointSize?: number;
pointSymbol?: string;
showPoints?: PointVisibility;
showPoints?: VisibilityMode;
}
export interface ScaleDistributionConfig {
log?: number;
@@ -71,15 +70,6 @@ export enum BarAlignment {
After = 1,
}
/**
* @alpha
*/
export enum BarValueVisibility {
Auto = 'auto',
Never = 'never',
Always = 'always',
}
/**
* @alpha
*/
@@ -18,7 +18,7 @@ import {
GraphFieldConfig,
GraphGradientMode,
LineInterpolation,
PointVisibility,
VisibilityMode,
StackingMode,
} from '@grafana/schema';
@@ -48,7 +48,7 @@ function mockDataFrame() {
spanNulls: false,
fillColor: '#ff0000',
fillOpacity: 0.1,
showPoints: PointVisibility.Always,
showPoints: VisibilityMode.Always,
stacking: {
group: 'A',
mode: StackingMode.Normal,
@@ -72,7 +72,7 @@ function mockDataFrame() {
barAlignment: BarAlignment.Before,
fillColor: '#ff0000',
fillOpacity: 0.1,
showPoints: PointVisibility.Always,
showPoints: VisibilityMode.Always,
stacking: {
group: 'A',
mode: StackingMode.Normal,
@@ -96,7 +96,7 @@ function mockDataFrame() {
spanNulls: false,
fillColor: '#ff0000',
fillOpacity: 0.1,
showPoints: PointVisibility.Always,
showPoints: VisibilityMode.Always,
stacking: {
group: 'B',
mode: StackingMode.Normal,
@@ -119,7 +119,7 @@ function mockDataFrame() {
barAlignment: BarAlignment.Before,
fillColor: '#ff0000',
fillOpacity: 0.1,
showPoints: PointVisibility.Always,
showPoints: VisibilityMode.Always,
stacking: {
group: 'B',
mode: StackingMode.Normal,
@@ -142,7 +142,7 @@ function mockDataFrame() {
barAlignment: BarAlignment.Before,
fillColor: '#ff0000',
fillOpacity: 0.1,
showPoints: PointVisibility.Always,
showPoints: VisibilityMode.Always,
stacking: {
group: 'B',
mode: StackingMode.None,
@@ -13,7 +13,7 @@ import {
AxisPlacement,
GraphDrawStyle,
GraphFieldConfig,
PointVisibility,
VisibilityMode,
ScaleDirection,
ScaleOrientation,
} from '@grafana/schema';
@@ -39,7 +39,7 @@ interface State {
const defaultConfig: GraphFieldConfig = {
drawStyle: GraphDrawStyle.Line,
showPoints: PointVisibility.Auto,
showPoints: VisibilityMode.Auto,
axisPlacement: AxisPlacement.Hidden,
};
@@ -163,7 +163,7 @@ export class Sparkline extends PureComponent<SparklineProps, State> {
const colorMode = getFieldColorModeForField(field);
const seriesColor = colorMode.getCalculator(field, theme)(0, 0);
const pointsMode =
customConfig.drawStyle === GraphDrawStyle.Points ? PointVisibility.Always : customConfig.showPoints;
customConfig.drawStyle === GraphDrawStyle.Points ? VisibilityMode.Always : customConfig.showPoints;
builder.addSeries({
pxAlign: false,
@@ -20,7 +20,7 @@ import {
GraphDrawStyle,
GraphFieldConfig,
GraphTresholdsStyleMode,
PointVisibility,
VisibilityMode,
ScaleDirection,
ScaleOrientation,
} from '@grafana/schema';
@@ -31,7 +31,7 @@ const defaultFormatter = (v: any) => (v == null ? '-' : v.toFixed(1));
const defaultConfig: GraphFieldConfig = {
drawStyle: GraphDrawStyle.Line,
showPoints: PointVisibility.Auto,
showPoints: VisibilityMode.Auto,
axisPlacement: AxisPlacement.Auto,
};
@@ -154,7 +154,7 @@ export const preparePlotConfigBuilder: UPlotConfigPrepFn<{ sync: DashboardCursor
}
const showPoints =
customConfig.drawStyle === GraphDrawStyle.Points ? PointVisibility.Always : customConfig.showPoints;
customConfig.drawStyle === GraphDrawStyle.Points ? VisibilityMode.Always : customConfig.showPoints;
let pointsFilter: uPlot.Series.Points.Filter = () => null;
@@ -6,7 +6,7 @@ import {
GraphGradientMode,
GraphTresholdsStyleMode,
LineInterpolation,
PointVisibility,
VisibilityMode,
StackingMode,
} from '@grafana/schema';
@@ -34,10 +34,10 @@ export const graphFieldOptions = {
] as Array<SelectableValue<BarAlignment>>,
showPoints: [
{ label: 'Auto', value: PointVisibility.Auto, description: 'Show points when the density is low' },
{ label: 'Always', value: PointVisibility.Always },
{ label: 'Never', value: PointVisibility.Never },
] as Array<SelectableValue<PointVisibility>>,
{ label: 'Auto', value: VisibilityMode.Auto, description: 'Show points when the density is low' },
{ label: 'Always', value: VisibilityMode.Always },
{ label: 'Never', value: VisibilityMode.Never },
] as Array<SelectableValue<VisibilityMode>>,
axisPlacement: [
{ label: 'Auto', value: AxisPlacement.Auto, description: 'First field on the left, everything else on the right' },
@@ -5,7 +5,7 @@ import {
GraphGradientMode,
AxisPlacement,
GraphDrawStyle,
PointVisibility,
VisibilityMode,
ScaleOrientation,
ScaleDirection,
GraphTresholdsStyleMode,
@@ -479,7 +479,7 @@ describe('UPlotConfigBuilder', () => {
scaleKey: 'scale-x',
fillOpacity: 50,
gradientMode: GraphGradientMode.Opacity,
showPoints: PointVisibility.Auto,
showPoints: VisibilityMode.Auto,
pointSize: 5,
lineColor: '#0000ff',
lineWidth: 1,
@@ -544,7 +544,7 @@ describe('UPlotConfigBuilder', () => {
scaleKey: 'scale-x',
fillOpacity: 50,
gradientMode: GraphGradientMode.Opacity,
showPoints: PointVisibility.Auto,
showPoints: VisibilityMode.Auto,
lineColor: '#0000ff',
lineWidth: 1,
spanNulls: false,
@@ -555,7 +555,7 @@ describe('UPlotConfigBuilder', () => {
scaleKey: 'scale-x',
fillOpacity: 50,
gradientMode: GraphGradientMode.Opacity,
showPoints: PointVisibility.Auto,
showPoints: VisibilityMode.Auto,
pointSize: 5,
lineColor: '#00ff00',
lineWidth: 1,
@@ -568,7 +568,7 @@ describe('UPlotConfigBuilder', () => {
scaleKey: 'scale-x',
fillOpacity: 50,
gradientMode: GraphGradientMode.Opacity,
showPoints: PointVisibility.Auto,
showPoints: VisibilityMode.Auto,
pointSize: 5,
lineColor: '#ff0000',
lineWidth: 1,
@@ -17,7 +17,7 @@ import {
LineConfig,
LineInterpolation,
PointsConfig,
PointVisibility,
VisibilityMode,
} from '@grafana/schema';
import { PlotConfigBuilder } from '../types';
import { getHueGradientFn, getOpacityGradientFn, getScaleGradientFn } from './gradientFills';
@@ -118,13 +118,13 @@ export class UPlotSeriesBuilder extends PlotConfigBuilder<SeriesProps, Series> {
if (drawStyle === GraphDrawStyle.Points) {
pointsConfig.points!.show = true;
} else {
if (showPoints === PointVisibility.Auto) {
if (showPoints === VisibilityMode.Auto) {
if (drawStyle === GraphDrawStyle.Bars) {
pointsConfig.points!.show = false;
}
} else if (showPoints === PointVisibility.Never) {
} else if (showPoints === VisibilityMode.Never) {
pointsConfig.points!.show = false;
} else if (showPoints === PointVisibility.Always) {
} else if (showPoints === VisibilityMode.Always) {
pointsConfig.points!.show = true;
}
}
+2 -2
View File
@@ -7,7 +7,7 @@ export {
GraphDrawStyle as DrawStyle,
// All exports
AxisPlacement,
PointVisibility,
VisibilityMode as PointVisibility,
LineInterpolation,
ScaleDistribution,
GraphGradientMode,
@@ -16,7 +16,7 @@ export {
ScaleDistributionConfig,
HideSeriesConfig,
BarAlignment,
BarValueVisibility,
VisibilityMode as BarValueVisibility,
ScaleOrientation,
ScaleDirection,
LineConfig,