diff --git a/core/core-frontend/src/views/chart/components/js/panel/charts/bar/bidirectional-bar.ts b/core/core-frontend/src/views/chart/components/js/panel/charts/bar/bidirectional-bar.ts
index 0ac6e1f10e..b45401a8b7 100644
--- a/core/core-frontend/src/views/chart/components/js/panel/charts/bar/bidirectional-bar.ts
+++ b/core/core-frontend/src/views/chart/components/js/panel/charts/bar/bidirectional-bar.ts
@@ -318,15 +318,13 @@ export class BidirectionalHorizontalBar extends G2PlotChartView<
   protected configLegend(chart: Chart, options: BidirectionalBarOptions): BidirectionalBarOptions {
     const o = super.configLegend(chart, options)
     if (o.legend) {
-      o.legend.itemName = {
-        formatter: (_text: string, _item: any, index: number) => {
-          const yaxis = chart.yAxis[0]
-          const yaxisExt = chart.yAxisExt[0]
-          if (index === 0) {
-            return yaxis.chartShowName ? yaxis.chartShowName : yaxis.name
-          }
-          return yaxisExt.chartShowName ? yaxisExt.chartShowName : yaxisExt.name
+      o.legend.itemName.formatter = (_text: string, _item: any, index: number) => {
+        const yaxis = chart.yAxis[0]
+        const yaxisExt = chart.yAxisExt[0]
+        if (index === 0) {
+          return yaxis.chartShowName ? yaxis.chartShowName : yaxis.name
         }
+        return yaxisExt.chartShowName ? yaxisExt.chartShowName : yaxisExt.name
       }
     }
     return o
diff --git a/core/core-frontend/src/views/chart/components/js/panel/charts/others/chart-mix.ts b/core/core-frontend/src/views/chart/components/js/panel/charts/others/chart-mix.ts
index 3846e06c7c..4fb148a7e0 100644
--- a/core/core-frontend/src/views/chart/components/js/panel/charts/others/chart-mix.ts
+++ b/core/core-frontend/src/views/chart/components/js/panel/charts/others/chart-mix.ts
@@ -573,20 +573,18 @@ export class ColumnLineMix extends G2PlotChartView<DualAxesOptions, DualAxes> {
       const left = cloneDeep(chart.data?.left?.data)
       const right = cloneDeep(chart.data?.right?.data)
 
-      o.legend.itemName = {
-        formatter: (text: string, item: any, index: number) => {
-          let name = undefined
-          if (item.viewId === 'left-axes-view' && text === 'value') {
-            name = left[0]?.categories[0]
-          } else if (item.viewId === 'right-axes-view' && text === 'valueExt') {
-            name = right[0]?.categories[0]
-          }
-          item.id = item.id + '__' + index //防止重复的图例出现问题，但是左右轴如果有相同的怎么办
-          if (name === undefined) {
-            return text
-          } else {
-            return name
-          }
+      o.legend.itemName.formatter = (text: string, item: any, index: number) => {
+        let name = undefined
+        if (item.viewId === 'left-axes-view' && text === 'value') {
+          name = left[0]?.categories[0]
+        } else if (item.viewId === 'right-axes-view' && text === 'valueExt') {
+          name = right[0]?.categories[0]
+        }
+        item.id = item.id + '__' + index //防止重复的图例出现问题，但是左右轴如果有相同的怎么办
+        if (name === undefined) {
+          return text
+        } else {
+          return name
         }
       }
 
diff --git a/core/core-frontend/src/views/chart/components/js/panel/common/common_antv.ts b/core/core-frontend/src/views/chart/components/js/panel/common/common_antv.ts
index 21d57ee6f4..6dce0b31a0 100644
--- a/core/core-frontend/src/views/chart/components/js/panel/common/common_antv.ts
+++ b/core/core-frontend/src/views/chart/components/js/panel/common/common_antv.ts
@@ -360,6 +360,12 @@ export function getLegend(chart: Chart) {
               r: l.size
             }
           },
+          itemName: {
+            style: {
+              fill: l.color,
+              fontSize: l.fontSize
+            }
+          },
           itemHeight: (l.fontSize > l.size * 2 ? l.fontSize : l.size * 2) + 4,
           radio: false,
           pageNavigator: {