From 8eca7a80683f0108e02d632bddeab237da45f040 Mon Sep 17 00:00:00 2001
From: jianneng-fit2cloud <jianneng.pan@fit2cloud.com>
Date: Wed, 14 May 2025 09:56:00 +0800
Subject: [PATCH] =?UTF-8?q?feat(=E5=9B=BE=E8=A1=A8):=20=E6=94=AF=E6=8C=81?=
 =?UTF-8?q?=E5=88=86=E7=BB=84=E5=A0=86=E5=8F=A0=E6=9F=B1=E7=8A=B6=E5=9B=BE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/js/panel/charts/g2/bar/bar.ts  |  6 +-
 .../js/panel/charts/g2/bar/barUtil.ts         |  6 +-
 .../js/panel/charts/g2/bar/group-stack-bar.ts | 81 +++++++++++++++++++
 3 files changed, 89 insertions(+), 4 deletions(-)
 create mode 100644 core/core-frontend/src/views/chart/components/js/panel/charts/g2/bar/group-stack-bar.ts

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 ed269d15d9..563611c2ba 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
@@ -15,7 +15,7 @@ import {
   DEFAULT_YAXIS_STYLE
 } from '@/views/chart/components/editor/util/chart'
 import _ from 'lodash'
-import { ViewSpec } from '@/views/chart/components/js/panel/charts/g2/bar/barUtil'
+import { Transform, ViewSpec } from '@/views/chart/components/js/panel/charts/g2/bar/barUtil'
 
 const { t } = useI18n()
 const DEFAULT_DATA: any[] = []
@@ -74,9 +74,9 @@ export class Bar extends G2ChartView<ViewSpec, G2Column> {
         shared: true
       }
     },
-    transform: [{ type: 'dodgeX' }],
+    transform: [{ type: 'dodgeX' } as Transform],
     data: []
-  }
+  } as ViewSpec
 
   async drawChart(drawOptions: G2DrawOptions<G2Column>): Promise<G2Column> {
     const { chart, container, action } = drawOptions
diff --git a/core/core-frontend/src/views/chart/components/js/panel/charts/g2/bar/barUtil.ts b/core/core-frontend/src/views/chart/components/js/panel/charts/g2/bar/barUtil.ts
index e472bba2ad..237b064008 100644
--- a/core/core-frontend/src/views/chart/components/js/panel/charts/g2/bar/barUtil.ts
+++ b/core/core-frontend/src/views/chart/components/js/panel/charts/g2/bar/barUtil.ts
@@ -1,7 +1,11 @@
 import { parseJson } from '@/views/chart/components/js/util'
 import { G2Spec } from '@antv/g2'
 
-export type ViewSpec = { children?: G2Spec[] } & G2Spec
+export type ViewSpec = { children?: G2Spec[]; [key: string]: any } & G2Spec
+export type Transform = {
+  type: string
+  [key: string]: any
+}
 
 export function handleEmptyDataStrategy<O extends ViewSpec>(chart: Chart, options: O): O {
   const { data } = options.children[0]
diff --git a/core/core-frontend/src/views/chart/components/js/panel/charts/g2/bar/group-stack-bar.ts b/core/core-frontend/src/views/chart/components/js/panel/charts/g2/bar/group-stack-bar.ts
new file mode 100644
index 0000000000..3ed635171f
--- /dev/null
+++ b/core/core-frontend/src/views/chart/components/js/panel/charts/g2/bar/group-stack-bar.ts
@@ -0,0 +1,81 @@
+import {
+  BAR_AXIS_TYPE,
+  BAR_EDITOR_PROPERTY_INNER
+} from '@/views/chart/components/js/panel/charts/g2/bar/common'
+import { flow, parseJson } from '@/views/chart/components/js/util'
+import { StackBar } from '@/views/chart/components/js/panel/charts/g2/bar/stack-bar'
+import { Transform, ViewSpec } from '@/views/chart/components/js/panel/charts/g2/bar/barUtil'
+import { valueFormatter } from '@/views/chart/components/js/formatter'
+
+/**
+ * 分组堆叠柱状图
+ */
+export class GroupStackBar extends StackBar {
+  propertyInner = {
+    ...this['propertyInner'],
+    'label-selector': [...BAR_EDITOR_PROPERTY_INNER['label-selector'], 'vPosition']
+  }
+
+  protected configLabel(chart: Chart, options: ViewSpec): ViewSpec {
+    const customAttr = parseJson(chart.customAttr)
+    const { label: labelAttr } = customAttr
+    if (!labelAttr || !labelAttr.show) return options
+
+    const { children } = options
+    const position = {
+      position: labelAttr.position === 'middle' ? 'inside' : labelAttr.position,
+      textAlign: 'center',
+      dy: labelAttr.position === 'top' ? -10 : 0,
+      dx: 0
+    }
+    const transform = labelAttr.fullDisplay
+      ? {}
+      : { transform: [{ type: 'exceedAdjust' }, { type: 'overlapHide' }] }
+
+    const label = {
+      text: 'value',
+      fillOpacity: 1,
+      fill: labelAttr.color,
+      fontSize: labelAttr.fontSize,
+      ...position,
+      formatter: (value, _data) => valueFormatter(value, labelAttr.labelFormatter),
+      ...transform
+    }
+    return {
+      ...options,
+      children: [
+        {
+          ...children[0],
+          labels: [label]
+        },
+        ...children.slice(1)
+      ]
+    }
+  }
+
+  protected setupOptions(chart: Chart, options: ViewSpec): ViewSpec {
+    return flow(
+      this.configTheme,
+      this.configEmptyDataStrategy,
+      this.configColor,
+      this.configBasicStyle,
+      this.configLabel,
+      this.configTooltip,
+      this.configLegend,
+      this.configXAxis,
+      this.configYAxis,
+      this.configAnalyse,
+      this.configBarConditions
+    )(chart, options, {}, this)
+  }
+
+  constructor(name = 'bar-group-stack') {
+    super(name)
+    this.intervalOptions.encode = {
+      ...this.intervalOptions.encode,
+      series: d => d.group
+    }
+    this.intervalOptions.transform = [{ type: 'stackY', groupBy: ['x', 'series'] } as Transform]
+    this.axis = [...BAR_AXIS_TYPE, 'xAxisExt', 'extStack']
+  }
+}