public/dataease
1
0
Fork 0
mirror of https://github.com/dataease/dataease.git synced 2026-06-17 21:08:31 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(图表): 优化极值标签的显示逻辑和样式处理

Browse Source
This commit is contained in:
jianneng-fit2cloud
2026-04-22 18:48:17 +08:00
parent 5583cc4fbb
commit 397c686eac
4 changed files with 67 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
core/core-frontend/src/views/chart/components/js/panel/charts/g2/bar/bar.ts
View File

@@ -182,7 +182,7 @@ export class Bar extends G2ChartView<ViewSpec, G2Column> {
},
...position,
formatter: (value, data) => {
if (data.extremum) {
if (data.extremum && showExtremumIds.includes(data.quotaList?.[0]?.id)) {
return ''
}
if (!labelAttr.seriesLabelFormatter?.length) {

28
core/core-frontend/src/views/chart/components/js/panel/charts/g2/bar/group-bar.ts
View File

@@ -66,13 +66,34 @@ export class GroupBar extends StackBar {
protected configLabel(chart: Chart, options: ViewSpec): ViewSpec {
const customAttr = parseJson(chart.customAttr)
const { label: labelAttr } = customAttr
if (!labelAttr.show || !labelAttr.childrenShow) return options
if (!labelAttr.show) return options
const { children } = options
if (labelAttr.showExtremum) {
const { x: xField, y: yField, color: colorField } = children[0].encode
addExtremumText(options.children, [], xField, yField, colorField, false)
}
if (!labelAttr.childrenShow) {
if (labelAttr.showExtremum) {
const ghostLabel = {
text: (d: any) => (d.extremum ? '' : ''),
fillOpacity: 0,
fontSize: 0
} as any
return {
...options,
children: [
{
...children[0],
labels: [ghostLabel]
},
...children.slice(1)
]
}
}
return options
}
const position = {
position: labelAttr.position === 'middle' ? 'inside' : labelAttr.position,
textAlign: 'center',
@@ -85,7 +106,10 @@ export class GroupBar extends StackBar {
fill: labelAttr.color,
fontSize: labelAttr.fontSize,
...position,
formatter: (value, _data) => valueFormatter(value, labelAttr.labelFormatter)
formatter: (value, data) =>
data.extremum && labelAttr.showExtremum
? ''
: valueFormatter(value, labelAttr.labelFormatter)
} as any
if (!labelAttr.fullDisplay) {
label.transform = [{ type: 'overlapHide' }]

27
core/core-frontend/src/views/chart/components/js/panel/charts/g2/line/area.ts
View File

@@ -202,7 +202,11 @@ export class Area extends G2ChartView {
labels: [
{
text: d => {
if (d.extremum) {
if (d.value === null) {
return ''
}
const isExtremumShown = d.extremum && showExtremumIds.includes(d.quotaList?.[0]?.id)
if (isExtremumShown) {
return ''
}
if (!labelAttr.seriesLabelFormatter?.length) {
@@ -220,9 +224,6 @@ export class Area extends G2ChartView {
style: {
opacity: 1,
fontSize: d => {
if (d.extremum) {
return 0
}
if (!labelAttr.seriesLabelFormatter?.length) {
return 12
}
@@ -230,16 +231,22 @@ export class Area extends G2ChartView {
if (!labelCfg) {
return 12
}
if (d.extremum && showExtremumIds.includes(d.quotaList?.[0]?.id)) {
return labelCfg.showExtremum ? labelCfg.fontSize : 0
}
if (!labelCfg.show) {
return 0
}
return labelCfg.fontSize
},
fill: d => {
if (d.extremum || !labelAttr.seriesLabelFormatter?.length) {
if (!labelAttr.seriesLabelFormatter?.length) {
return 'black'
}
const labelCfg = formatterMap?.[d.quotaList[0].id] as SeriesFormatter
if (d.extremum && showExtremumIds.includes(d.quotaList?.[0]?.id)) {
return labelCfg?.showExtremum ? labelCfg?.color ?? 'black' : 'black'
}
if (!labelCfg?.show) {
return 'black'
}
@@ -249,7 +256,10 @@ export class Area extends G2ChartView {
return color
},
position: d => {
if (d.extremum || !labelAttr.seriesLabelFormatter?.length) {
if (
(d.extremum && showExtremumIds.includes(d.quotaList?.[0]?.id)) ||
!labelAttr.seriesLabelFormatter?.length
) {
return 'top'
}
const labelCfg = formatterMap?.[d.quotaList[0].id] as SeriesFormatter
@@ -260,7 +270,10 @@ export class Area extends G2ChartView {
}
},
textBaseline: d => {
if (d.extremum || !labelAttr.seriesLabelFormatter?.length) {
if (
(d.extremum && showExtremumIds.includes(d.quotaList?.[0]?.id)) ||
!labelAttr.seriesLabelFormatter?.length
) {
return 'bottom'
}
const labelCfg = formatterMap?.[d.quotaList[0].id] as SeriesFormatter

27
core/core-frontend/src/views/chart/components/js/panel/charts/g2/line/line.ts
View File

@@ -212,7 +212,11 @@ export class Line extends G2ChartView {
labels: [
{
text: d => {
if (d.extremum || d.value === null) {
if (d.value === null) {
return ''
}
const isExtremumShown = d.extremum && showExtremumIds.includes(d.quotaList?.[0]?.id)
if (isExtremumShown) {
return ''
}
if (!labelAttr.seriesLabelFormatter?.length) {
@@ -230,9 +234,6 @@ export class Line extends G2ChartView {
style: {
opacity: 1,
fontSize: d => {
if (d.extremum) {
return 0
}
if (!labelAttr.seriesLabelFormatter?.length) {
return 12
}
@@ -240,16 +241,22 @@ export class Line extends G2ChartView {
if (!labelCfg) {
return 12
}
if (d.extremum && showExtremumIds.includes(d.quotaList?.[0]?.id)) {
return labelCfg.showExtremum ? labelCfg.fontSize : 0
}
if (!labelCfg.show) {
return 0
}
return labelCfg.fontSize
},
fill: d => {
if (d.extremum || !labelAttr.seriesLabelFormatter?.length) {
if (!labelAttr.seriesLabelFormatter?.length) {
return 'black'
}
const labelCfg = formatterMap?.[d.quotaList[0].id] as SeriesFormatter
if (d.extremum && showExtremumIds.includes(d.quotaList?.[0]?.id)) {
return labelCfg?.showExtremum ? labelCfg?.color ?? 'black' : 'black'
}
if (!labelCfg?.show) {
return 'black'
}
@@ -259,7 +266,10 @@ export class Line extends G2ChartView {
return color
},
position: d => {
if (d.extremum || !labelAttr.seriesLabelFormatter?.length) {
if (
(d.extremum && showExtremumIds.includes(d.quotaList?.[0]?.id)) ||
!labelAttr.seriesLabelFormatter?.length
) {
return 'top'
}
const labelCfg = formatterMap?.[d.quotaList[0].id] as SeriesFormatter
@@ -270,7 +280,10 @@ export class Line extends G2ChartView {
}
},
textBaseline: d => {
if (d.extremum || !labelAttr.seriesLabelFormatter?.length) {
if (
(d.extremum && showExtremumIds.includes(d.quotaList?.[0]?.id)) ||
!labelAttr.seriesLabelFormatter?.length
) {
return 'bottom'
}
const labelCfg = formatterMap?.[d.quotaList[0].id] as SeriesFormatter