diff --git a/core/core-frontend/src/views/chart/components/js/panel/charts/pie/pie.ts b/core/core-frontend/src/views/chart/components/js/panel/charts/pie/pie.ts
index 0e67c0bb51..7f18e2bffa 100644
--- a/core/core-frontend/src/views/chart/components/js/panel/charts/pie/pie.ts
+++ b/core/core-frontend/src/views/chart/components/js/panel/charts/pie/pie.ts
@@ -100,7 +100,12 @@ export class Pie extends G2PlotChartView<PieOptions, G2Pie> {
             end: [{ trigger: 'interval:mouseleave', action: 'active-region:hide' }]
           }
         }
-      ]
+      ],
+      meta: {
+        field: {
+          type: 'cat'
+        }
+      }
     }
     const options = this.setupOptions(chart, initOptions)
 
diff --git a/core/core-frontend/src/views/chart/components/js/panel/charts/pie/rose.ts b/core/core-frontend/src/views/chart/components/js/panel/charts/pie/rose.ts
index 4fd1846860..2cd4f6e0a4 100644
--- a/core/core-frontend/src/views/chart/components/js/panel/charts/pie/rose.ts
+++ b/core/core-frontend/src/views/chart/components/js/panel/charts/pie/rose.ts
@@ -71,7 +71,12 @@ export class Rose extends G2PlotChartView<RoseOptions, G2Rose> {
             end: [{ trigger: 'interval:mouseleave', action: 'tooltip:hide' }]
           }
         }
-      ]
+      ],
+      meta: {
+        field: {
+          type: 'cat'
+        }
+      }
     }
     const options = this.setupOptions(chart, baseOptions)
     // custom color