Skip to content
This repository has been archived by the owner on Dec 10, 2021. It is now read-only.

Commit

Permalink
fix(plugin-chart-echarts): dynamically determine min/max on gauge cha…
Browse files Browse the repository at this point in the history
…rt axis
  • Loading branch information
root committed Apr 23, 2021
1 parent fa656f7 commit 1c03268
Show file tree
Hide file tree
Showing 3 changed files with 16 additions and 8 deletions.
4 changes: 1 addition & 3 deletions plugins/plugin-chart-echarts/src/Gauge/controlPanel.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -68,8 +68,7 @@ const config: ControlPanelConfig = {
config: {
type: 'TextControl',
isInt: true,
default: String(DEFAULT_FORM_DATA.minVal),
validators: [validateNonEmpty, validateInteger],
default: DEFAULT_FORM_DATA.minVal,
renderTrigger: true,
label: t('Min'),
description: t('Minimum value on the gauge axis'),
Expand All @@ -81,7 +80,6 @@ const config: ControlPanelConfig = {
type: 'TextControl',
isInt: true,
default: DEFAULT_FORM_DATA.maxVal,
validators: [validateNonEmpty, validateInteger],
renderTrigger: true,
label: t('Max'),
description: t('Maximum value on the gauge axis'),
Expand Down
16 changes: 13 additions & 3 deletions plugins/plugin-chart-echarts/src/Gauge/transformProps.ts
Original file line number Diff line number Diff line change
Expand Up @@ -70,6 +70,14 @@ const setIntervalBoundsAndColors = (
const calculateAxisLineWidth = (data: DataRecord[], fontSize: number, overlap: boolean): number =>
overlap ? fontSize : data.length * fontSize;

const calculateMin = (data: GaugeDataItemOption[]) => {
return 2 * Math.min(...data.map(d => d.value).concat([0]));
};

const calculateMax = (data: GaugeDataItemOption[]) => {
return 2 * Math.max(...data.map(d => d.value).concat([0]));
};

export default function transformProps(chartProps: ChartProps) {
const { width, height, formData, queriesData } = chartProps;
const {
Expand Down Expand Up @@ -195,14 +203,16 @@ export default function transformProps(chartProps: ChartProps) {
show: showPointer,
};
}
const min = minVal ? minVal : calculateMin(transformedData);
const max = maxVal ? maxVal : calculateMax(transformedData);

const series: GaugeSeriesOption[] = [
{
type: 'gauge',
startAngle,
endAngle,
min: minVal,
max: maxVal,
min,
max,
progress,
animation,
axisLine: axisLine as GaugeSeriesOption['axisLine'],
Expand All @@ -221,7 +231,7 @@ export default function transformProps(chartProps: ChartProps) {
tooltip: { trigger: 'item' },
series,
};
console.log(777, echartOptions);

return {
width,
height,
Expand Down
4 changes: 2 additions & 2 deletions plugins/plugin-chart-echarts/src/Gauge/types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -51,8 +51,8 @@ export const DEFAULT_FORM_DATA: EchartsGaugeFormData = {
...DEFAULT_LEGEND_FORM_DATA,
groupby: [],
rowLimit: 10,
minVal: 0,
maxVal: 100,
minVal: null,
maxVal: null,
fontSize: 15,
numberFormat: 'SMART_NUMBER',
animation: true,
Expand Down

0 comments on commit 1c03268

Please sign in to comment.