IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2024-12-30 10:47:30 -06:00
Code Issues Packages Projects Releases Wiki Activity

BarChart: Fix field enumeration for bar value display and legend items (#39308)

Browse Source
This commit is contained in:
Leon Sorokin 2021-09-17 09:57:57 -05:00 committed by GitHub
parent e1f1773036
commit 29e8728ef0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 20 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
devenv/dev-dashboards/panel-barchart/barchart-autosizing.json
View File

@ -76,6 +76,7 @@
},
"orientation": "auto",
"showValue": "auto",
"stacking": "none",
"text": {},
"tooltip": {
"mode": "single"
@ -83,7 +84,7 @@
},
"targets": [
{
"csvContent": "Name,Stat1,Stat2\nStockholm, 10, 15\nNew York, 19, 5\nLondon, 10, 1\nNegative, 15, -5\nLong value, 15,10",
"csvContent": "Time,Name,Stat1,Stat2\n2020-01-01T00:00:00Z,Stockholm, 10, 15\n2020-01-01T00:00:00Z,New York, 19, 5\n2020-01-01T00:00:00Z,London, 10, 1\n2020-01-01T00:00:00Z,Negative, 15, -5\n2020-01-01T00:00:00Z,Long value, 15,10",
"refId": "A",
"scenarioId": "csv_content"
}
@ -147,6 +148,7 @@
},
"orientation": "auto",
"showValue": "auto",
"stacking": "none",
"text": {},
"tooltip": {
"mode": "single"
@ -216,6 +218,7 @@
},
"orientation": "auto",
"showValue": "auto",
"stacking": "none",
"text": {},
"tooltip": {
"mode": "single"
@ -285,6 +288,7 @@
},
"orientation": "auto",
"showValue": "always",
"stacking": "none",
"text": {},
"tooltip": {
"mode": "single"
@ -353,6 +357,7 @@
},
"orientation": "auto",
"showValue": "auto",
"stacking": "none",
"text": {
"titleSize": 10,
"valueSize": 25
@ -425,6 +430,7 @@
},
"orientation": "horizontal",
"showValue": "auto",
"stacking": "none",
"text": {},
"tooltip": {
"mode": "single"
@ -495,6 +501,7 @@
},
"orientation": "horizontal",
"showValue": "auto",
"stacking": "none",
"text": {},
"tooltip": {
"mode": "single"

9
public/app/plugins/panel/barchart/BarChart.tsx
View File

@ -1,6 +1,6 @@
import React, { useRef } from 'react';
import { cloneDeep } from 'lodash';
import { DataFrame, TimeRange } from '@grafana/data';
import { DataFrame, FieldType, TimeRange } from '@grafana/data';
import { GraphNG, GraphNGProps, PlotLegend, UPlotConfigBuilder, usePanelContext, useTheme2 } from '@grafana/ui';
import { LegendDisplayMode } from '@grafana/schema';
import { BarChartOptions } from './types';
@ -38,7 +38,12 @@ export const BarChart: React.FC<BarChartProps> = (props) => {
return <PlotLegend data={props.frames} config={config} maxHeight="35%" maxWidth="60%" {...props.legend} />;
};
const rawValue = (seriesIdx: number, valueIdx: number) => frame0Ref.current!.fields[seriesIdx].values.get(valueIdx);
const rawValue = (seriesIdx: number, valueIdx: number) => {
let field = frame0Ref.current!.fields.find(
(f) => f.type === FieldType.number && f.state?.seriesIndex === seriesIdx - 1
);
return field!.values.get(valueIdx);
};
const prepConfig = (alignedFrame: DataFrame, allFrames: DataFrame[], getTimeRange: () => TimeRange) => {
const { timeZone, orientation, barWidth, showValue, groupWidth, stacking, legend, tooltip, text } = props;

6
public/app/plugins/panel/barchart/utils.ts
View File

@ -46,6 +46,7 @@ export const preparePlotConfigBuilder: UPlotConfigPrepFn<BarChartOptions> = ({
stacking,
text,
rawValue,
allFrames,
}) => {
const builder = new UPlotConfigBuilder();
const defaultValueFormatter = (seriesIdx: number, value: any) =>
@ -141,8 +142,11 @@ export const preparePlotConfigBuilder: UPlotConfigPrepFn<BarChartOptions> = ({
softMax: customConfig.axisSoftMax,
// The following properties are not used in the uPlot config, but are utilized as transport for legend config
// PlotLegend currently gets unfiltered DataFrame[], so index must be into that field array, not the prepped frame's which we're iterating here
dataFrameFieldIndex: {
fieldIndex: i,
fieldIndex: allFrames[0].fields.findIndex(
(f) => f.type === FieldType.number && f.state?.seriesIndex === seriesIndex - 1
),
frameIndex: 0,
},
});