diff --git a/core/core-frontend/src/views/chart/components/editor/editor-style/components/LabelSelector.vue b/core/core-frontend/src/views/chart/components/editor/editor-style/components/LabelSelector.vue index 1748929e71..eb1e75be55 100644 --- a/core/core-frontend/src/views/chart/components/editor/editor-style/components/LabelSelector.vue +++ b/core/core-frontend/src/views/chart/components/editor/editor-style/components/LabelSelector.vue @@ -147,7 +147,7 @@ const initSeriesLabel = () => { fontSize: COMPUTED_DEFAULT_LABEL.value.fontSize, showExtremum: false } as SeriesFormatter - if (seriesAxisMap[next.seriesId]) { + if (seriesAxisMap[next.id]) { tmp = { ...tmp, formatterCfg: seriesAxisMap[next.id].formatterCfg, diff --git a/core/core-frontend/src/views/chart/components/js/extremumUitl.ts b/core/core-frontend/src/views/chart/components/js/extremumUitl.ts index 51c0706957..ca24ce271e 100644 --- a/core/core-frontend/src/views/chart/components/js/extremumUitl.ts +++ b/core/core-frontend/src/views/chart/components/js/extremumUitl.ts @@ -104,18 +104,51 @@ const noChildrenFieldChart = chart => { export const extremumEvt = (newChart, chart, _options, container) => { chart.container = container + const { label: labelAttr } = parseJson(chart.customAttr) + const { yAxis } = parseJson(chart) newChart.on('beforerender', ev => { ev.view.on('beforepaint', () => { newChart.chart.geometries[0]?.beforeMappingData.forEach(i => { + i.forEach(item => { + delete item._origin.EXTREME + }) const { minItem, maxItem } = findMinMax(i) - minItem._origin.EXTREME = true - maxItem._origin.EXTREME = true + let showExtremum = false + if (noChildrenFieldChart(chart) || yAxis.length > 1) { + const seriesLabelFormatter = labelAttr.seriesLabelFormatter.find( + d => d.name === minItem._origin.category || d.name === maxItem._origin.category + ) + showExtremum = seriesLabelFormatter?.showExtremum + } else { + if (['bar-group'].includes(chart.type)) { + showExtremum = labelAttr.showExtremum + } else { + showExtremum = labelAttr.seriesLabelFormatter[0]?.showExtremum + } + } + if (showExtremum) { + minItem._origin.EXTREME = true + maxItem._origin.EXTREME = true + } }) }) - newChart.chart.geometries[0].on('beforerenderlabel', () => { + newChart.chart.geometries[0].on('afteranimate', () => { createExtremumPoint(chart, ev) }) }) + newChart.on('legend-item:click', ev => { + const legendShowSize = ev.view + .getController('legend') + .components[0].component.cfg.items.filter(l => !l.unchecked) + if (legendShowSize.length === 0) { + const allElement = document.getElementById('point_' + chart.id) + if (allElement && allElement.childNodes) { + allElement.childNodes.forEach(c => { + c.style.display = 'none' + }) + } + } + }) } const findMinMax = (data): { minItem; maxItem } => { @@ -182,16 +215,25 @@ export const createExtremumPoint = (chart, ev) => { attr = labelAttr.seriesLabelFormatter[0] } const fontSize = attr ? attr.fontSize : labelAttr.fontSize - const maxKey = 'point_' + pointObj._origin.category + '-' + maxItem._origin.value + if (!minItem) { + return + } + const maxKey = + 'point_' + + pointObj._origin.category + + '-' + + (maxItem ? maxItem._origin.value : minItem._origin.value) const minKey = 'point_' + pointObj._origin.category + '-' + minItem._origin.value // 最值标注 - if (showExtremum) { - createExtremumDiv( - maxKey, - maxItem._origin.value, - attr ? attr.formatterCfg : labelAttr.labelFormatter, - chart.id - ) + if (showExtremum && labelAttr.show) { + if (maxItem) { + createExtremumDiv( + maxKey, + maxItem._origin.value, + attr ? attr.formatterCfg : labelAttr.labelFormatter, + chart.id + ) + } createExtremumDiv( minKey, minItem._origin.value, diff --git a/core/core-frontend/src/views/chart/components/js/panel/charts/bar/bar.ts b/core/core-frontend/src/views/chart/components/js/panel/charts/bar/bar.ts index 63df539e27..f013a706ed 100644 --- a/core/core-frontend/src/views/chart/components/js/panel/charts/bar/bar.ts +++ b/core/core-frontend/src/views/chart/components/js/panel/charts/bar/bar.ts @@ -353,6 +353,9 @@ export class GroupBar extends StackBar { const label = { ...baseOptions.label, formatter: function (param: Datum, _point) { + if (param.EXTREME) { + return '' + } const value = valueFormatter(param.value, labelAttr.labelFormatter) return labelAttr.childrenShow ? value : null } diff --git a/core/core-frontend/src/views/chart/components/js/panel/charts/line/area.ts b/core/core-frontend/src/views/chart/components/js/panel/charts/line/area.ts index 7687880de2..c7f08f48f3 100644 --- a/core/core-frontend/src/views/chart/components/js/panel/charts/line/area.ts +++ b/core/core-frontend/src/views/chart/components/js/panel/charts/line/area.ts @@ -136,6 +136,9 @@ export class Area extends G2PlotChartView { fields: [], ...tmpOptions.label, formatter: (data: Datum, _point) => { + if (data.EXTREME) { + return '' + } if (!labelAttr.seriesLabelFormatter?.length) { return data.value } diff --git a/core/core-frontend/src/views/chart/components/js/panel/charts/line/line.ts b/core/core-frontend/src/views/chart/components/js/panel/charts/line/line.ts index 8ecd160a16..5d4e4cf216 100644 --- a/core/core-frontend/src/views/chart/components/js/panel/charts/line/line.ts +++ b/core/core-frontend/src/views/chart/components/js/panel/charts/line/line.ts @@ -133,6 +133,9 @@ export class Line extends G2PlotChartView { offsetY: -8, layout: [{ type: 'hide-overlap' }, { type: 'limit-in-plot' }], formatter: (data: Datum, _point) => { + if (data.EXTREME) { + return '' + } if (!labelAttr.seriesLabelFormatter?.length) { return data.value }