diff --git a/plugins/plugin-chart-echarts/src/Gauge/transformProps.ts b/plugins/plugin-chart-echarts/src/Gauge/transformProps.ts index da9de2976e..461fb8f594 100644 --- a/plugins/plugin-chart-echarts/src/Gauge/transformProps.ts +++ b/plugins/plugin-chart-echarts/src/Gauge/transformProps.ts @@ -111,7 +111,7 @@ export default function transformProps(chartProps: ChartProps) { ); const transformedData: GaugeDataItemOption[] = data.map((data_point, index) => ({ value: data_point[getMetricLabel(metric as QueryFormMetric)] as number, - name: groupby.map(column => `${column}: ${data_point[column]}`).join(', '), + name: groupby.map(column => `${column}=${data_point[column]}`).join(', '), itemStyle: { color: colorFn(index), }, @@ -173,6 +173,12 @@ export default function transformProps(chartProps: ChartProps) { formatter: (value: number) => formatValue(value), color: DEFAULT_GAUGE_SERIES_OPTION.detail?.color, }; + const tooltip = { + formatter: params => { + const { name, value } = params; + return `${name} : ${formatValue(value)}`; + }, + }; let pointer; if (intervalBoundsAndColors.length) { @@ -206,14 +212,16 @@ export default function transformProps(chartProps: ChartProps) { axisTick, pointer, detail, + tooltip, data: transformedData, }, ]; const echartOptions: EChartsOption = { + tooltip: { trigger: 'item' }, series, }; - + console.log(777, echartOptions); return { width, height,