PieChart: Progress on new core pie chart (#28020)

Use visx for the Pie chart plugin.

Co-authored-by: Oscar Kilhed <oscar.kilhed@grafana.com>
This commit is contained in:
Torkel Ödegaard
2021-02-11 14:32:33 +01:00
committed by GitHub
parent f9199ecc0c
commit cb5928fdb7
15 changed files with 1006 additions and 191 deletions

View File

@ -1,29 +1,53 @@
import { PanelPlugin } from '@grafana/data';
import { FieldColorModeId, FieldConfigProperty, PanelPlugin } from '@grafana/data';
import { PieChartPanel } from './PieChartPanel';
import { PieChartOptions } from './types';
import { addStandardDataReduceOptions } from '../stat/types';
import { PieChartType } from '@grafana/ui';
export const plugin = new PanelPlugin<PieChartOptions>(PieChartPanel).setPanelOptions((builder) => {
addStandardDataReduceOptions(builder, false);
builder
.addRadio({
name: 'Piechart type',
description: 'How the piechart should be rendered',
path: 'pieType',
settings: {
options: [
{ value: PieChartType.PIE, label: 'Pie' },
{ value: PieChartType.DONUT, label: 'Donut' },
],
export const plugin = new PanelPlugin<PieChartOptions>(PieChartPanel)
.useFieldConfig({
standardOptions: {
[FieldConfigProperty.Color]: {
settings: {
byValueSupport: false,
bySeriesSupport: true,
preferThresholdsMode: false,
},
defaultValue: {
mode: FieldColorModeId.PaletteClassic,
},
},
defaultValue: PieChartType.PIE,
})
.addNumberInput({
name: 'Width',
description: 'Width of the piechart outline',
path: 'strokeWidth',
defaultValue: 1,
});
});
},
})
.setPanelOptions((builder) => {
addStandardDataReduceOptions(builder, false);
builder
.addRadio({
name: 'Piechart type',
description: 'How the piechart should be rendered',
path: 'pieType',
settings: {
options: [
{ value: PieChartType.Pie, label: 'Pie' },
{ value: PieChartType.Donut, label: 'Donut' },
],
},
defaultValue: PieChartType.Pie,
})
.addBooleanSwitch({
name: 'Show name',
path: 'labelOptions.showName',
defaultValue: true,
})
.addBooleanSwitch({
name: 'Show value',
path: 'labelOptions.showValue',
defaultValue: false,
})
.addBooleanSwitch({
name: 'Show percent',
path: 'labelOptions.showPercent',
defaultValue: false,
});
});