From fbdd5dffbb98e5135afe47a326a8157c1b6a804c Mon Sep 17 00:00:00 2001 From: jianneng-fit2cloud Date: Fri, 17 Oct 2025 14:31:09 +0800 Subject: [PATCH] =?UTF-8?q?fix(=E5=9B=BE=E8=A1=A8):=20=E4=BF=AE=E5=A4=8D?= =?UTF-8?q?=E6=9F=B1=E6=9D=A1=E5=9B=BE=E8=87=AA=E5=AE=9A=E4=B9=89=E9=85=8D?= =?UTF-8?q?=E8=89=B2=E4=B8=8D=E7=94=9F=E6=95=88=E7=9A=84=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/js/panel/charts/g2/bar/bar.ts | 55 +++++++++++++++++-- .../js/panel/charts/g2/bar/group-bar.ts | 12 +--- .../js/panel/charts/g2/bar/stack-bar.ts | 4 -- 3 files changed, 54 insertions(+), 17 deletions(-) diff --git a/core/core-frontend/src/views/chart/components/js/panel/charts/g2/bar/bar.ts b/core/core-frontend/src/views/chart/components/js/panel/charts/g2/bar/bar.ts index 5294a5150a..e60d99541d 100644 --- a/core/core-frontend/src/views/chart/components/js/panel/charts/g2/bar/bar.ts +++ b/core/core-frontend/src/views/chart/components/js/panel/charts/g2/bar/bar.ts @@ -7,21 +7,20 @@ import { } from '@/views/chart/components/js/panel/charts/g2/bar/common' import { useI18n } from '@/hooks/web/useI18n' import { flow, hexColorToRGBA, hexToRgba, parseJson } from '@/views/chart/components/js/util' -import { cloneDeep, defaultsDeep, isEmpty } from 'lodash-es' +import { cloneDeep, defaultsDeep, filter, find, isEmpty } from 'lodash-es' import { valueFormatter } from '@/views/chart/components/js/formatter' import { getLineDash, + handleChartDashboardHidden, setGradientColor, TOOLTIP_ITEM_TPL, - TOOLTIP_TITLE_TPL, - handleChartDashboardHidden + TOOLTIP_TITLE_TPL } from '@/views/chart/components/js/panel/common/common_antv' import { DEFAULT_BASIC_STYLE, DEFAULT_YAXIS_EXT_STYLE, DEFAULT_YAXIS_STYLE } from '@/views/chart/components/editor/util/chart' -import { filter, find } from 'lodash-es' import { configTooltip, createTooltipWrapper, @@ -736,10 +735,58 @@ export class Bar extends G2ChartView { return options } + protected configColor(chart: Chart, options: ViewSpec): ViewSpec { + const { basicStyle } = parseJson(chart.customAttr) + const { seriesColor } = basicStyle + if (!seriesColor?.length) { + return options + } + const { xAxis, xAxisExt, yAxis } = chart + if (!xAxis?.length || !yAxis?.length) { + return options + } + const relations = [] + if (xAxisExt?.length) { + seriesColor.forEach(item => { + let color = hexColorToRGBA(item.color, basicStyle.alpha) + if (basicStyle.gradient) { + color = setGradientColor(color, true, 270) + } + relations.push([item.id, color]) + }) + } else { + const colorMap = seriesColor.reduce((pre, next) => { + pre[next.id] = next.color + return pre + }, {}) + yAxis.forEach(item => { + if (colorMap[item.id]) { + let color = hexColorToRGBA(colorMap[item.id], basicStyle.alpha) + if (basicStyle.gradient) { + color = setGradientColor(color, true, 270) + } + relations.push([item.chartShowName ?? item.name, color]) + } + }) + } + if (relations.length) { + const scaleOptions = { + scale: { + color: { + relations + } + } + } + defaultsDeep(options, scaleOptions) + } + return options + } + protected setupOptions(chart: Chart, options: ViewSpec): ViewSpec { return flow( this.configTheme, this.configBasicStyle, + this.configColor, this.configLabel, this.configTooltip, this.configLegend, diff --git a/core/core-frontend/src/views/chart/components/js/panel/charts/g2/bar/group-bar.ts b/core/core-frontend/src/views/chart/components/js/panel/charts/g2/bar/group-bar.ts index 6fba2d4fe9..794d1eb620 100644 --- a/core/core-frontend/src/views/chart/components/js/panel/charts/g2/bar/group-bar.ts +++ b/core/core-frontend/src/views/chart/components/js/panel/charts/g2/bar/group-bar.ts @@ -3,7 +3,7 @@ import { BAR_EDITOR_PROPERTY, BAR_EDITOR_PROPERTY_INNER } from '@/views/chart/components/js/panel/charts/g2/bar/common' -import { flow, parseJson } from '@/views/chart/components/js/util' +import { flow, parseJson, setUpGroupSeriesColor } from '@/views/chart/components/js/util' import { StackBar } from '@/views/chart/components/js/panel/charts/g2/bar/stack-bar' import { Chart as G2Column } from '@antv/g2' import { ViewSpec } from '@/views/chart/components/js/panel/charts/g2/bar/barUtil' @@ -95,14 +95,8 @@ export class GroupBar extends StackBar { } } - protected configColor(_chart: Chart, options: ViewSpec): ViewSpec { - // return this.configGroupColor(chart, options) - return options - } - - public setupSeriesColor(_chart: ChartObj, _data?: any[]): ChartBasicStyle['seriesColor'] { - // return setUpGroupSeriesColor(chart, data) - return [] + public setupSeriesColor(chart: ChartObj, data?: any[]): ChartBasicStyle['seriesColor'] { + return setUpGroupSeriesColor(chart, data) } protected setupOptions(chart: Chart, options: ViewSpec): ViewSpec { diff --git a/core/core-frontend/src/views/chart/components/js/panel/charts/g2/bar/stack-bar.ts b/core/core-frontend/src/views/chart/components/js/panel/charts/g2/bar/stack-bar.ts index 59bcce52d2..c90d8db33b 100644 --- a/core/core-frontend/src/views/chart/components/js/panel/charts/g2/bar/stack-bar.ts +++ b/core/core-frontend/src/views/chart/components/js/panel/charts/g2/bar/stack-bar.ts @@ -160,10 +160,6 @@ export class StackBar extends Bar { } } - protected configColor(_chart: Chart, options: ViewSpec): ViewSpec { - return options - } - protected configData(chart: Chart, options: ViewSpec): ViewSpec { const { xAxis, extStack, yAxis } = chart const mainSort = xAxis.some(axis => axis.sort !== 'none')