diff --git a/__tests__/integration/snapshots/animation/sold-interval-pie-keyframe/interval2-0.png b/__tests__/integration/snapshots/animation/sold-interval-pie-keyframe/interval2-0.png
index d73c229224..d089245dfe 100644
Binary files a/__tests__/integration/snapshots/animation/sold-interval-pie-keyframe/interval2-0.png and b/__tests__/integration/snapshots/animation/sold-interval-pie-keyframe/interval2-0.png differ
diff --git a/__tests__/integration/snapshots/animation/sold-interval-pie-keyframe/interval2-1.png b/__tests__/integration/snapshots/animation/sold-interval-pie-keyframe/interval2-1.png
index 2022995e0d..999dd5bd42 100644
Binary files a/__tests__/integration/snapshots/animation/sold-interval-pie-keyframe/interval2-1.png and b/__tests__/integration/snapshots/animation/sold-interval-pie-keyframe/interval2-1.png differ
diff --git a/__tests__/integration/snapshots/animation/sold-interval-pie-keyframe/interval3-0.png b/__tests__/integration/snapshots/animation/sold-interval-pie-keyframe/interval3-0.png
index 7e1efec958..b4eae9a595 100644
Binary files a/__tests__/integration/snapshots/animation/sold-interval-pie-keyframe/interval3-0.png and b/__tests__/integration/snapshots/animation/sold-interval-pie-keyframe/interval3-0.png differ
diff --git a/__tests__/integration/snapshots/animation/sold-interval-pie-keyframe/interval3-1.png b/__tests__/integration/snapshots/animation/sold-interval-pie-keyframe/interval3-1.png
index 8efbd9daa1..a572905217 100644
Binary files a/__tests__/integration/snapshots/animation/sold-interval-pie-keyframe/interval3-1.png and b/__tests__/integration/snapshots/animation/sold-interval-pie-keyframe/interval3-1.png differ
diff --git a/__tests__/integration/snapshots/animation/sold-interval-pie-keyframe/interval3-2.png b/__tests__/integration/snapshots/animation/sold-interval-pie-keyframe/interval3-2.png
index c0521c9f5e..f5f0e49f4a 100644
Binary files a/__tests__/integration/snapshots/animation/sold-interval-pie-keyframe/interval3-2.png and b/__tests__/integration/snapshots/animation/sold-interval-pie-keyframe/interval3-2.png differ
diff --git a/__tests__/integration/snapshots/api/chartOptionsChangeData.png b/__tests__/integration/snapshots/api/chartOptionsChangeData.png
index 62d71cfba3..c7315f7c07 100644
Binary files a/__tests__/integration/snapshots/api/chartOptionsChangeData.png and b/__tests__/integration/snapshots/api/chartOptionsChangeData.png differ
diff --git a/src/component/legendCategory.ts b/src/component/legendCategory.ts
index c6817b0ca5..0305b81c37 100644
--- a/src/component/legendCategory.ts
+++ b/src/component/legendCategory.ts
@@ -244,6 +244,11 @@ export const LegendCategory: GCC<LegendCategoryOptions> = (options) => {
     };
 
     const { legend: legendTheme = {} } = theme;
+
+    const categoryStyle = adaptor(
+      Object.assign({}, legendTheme, legendStyle, style),
+    );
+
     const layoutWrapper = new LegendCategoryLayout({
       style: {
         x: bbox.x,
@@ -251,13 +256,15 @@ export const LegendCategory: GCC<LegendCategoryOptions> = (options) => {
         width: bbox.width,
         height: bbox.height,
         ...finalLayout,
+        // @ts-ignore
+        subOptions: categoryStyle,
       },
     });
 
     layoutWrapper.appendChild(
       new Category({
         className: 'legend-category',
-        style: adaptor(Object.assign({}, legendTheme, legendStyle, style)),
+        style: categoryStyle,
       }),
     );
     return layoutWrapper;
diff --git a/src/component/legendContinuous.ts b/src/component/legendContinuous.ts
index 58012fc35a..e84a5bd0ed 100644
--- a/src/component/legendContinuous.ts
+++ b/src/component/legendContinuous.ts
@@ -214,15 +214,6 @@ export const LegendContinuous: GCC<LegendContinuousOptions> = (options) => {
     const { bbox } = value;
     const { x, y, width, height } = bbox;
     const finalLayout = inferComponentLayout(position, layout);
-    const layoutWrapper = new G2Layout({
-      style: {
-        x,
-        y,
-        width,
-        height,
-        ...finalLayout,
-      },
-    });
 
     const { continuousLegend: legendTheme = {} } = theme;
     const finalStyle = adaptor(
@@ -252,6 +243,18 @@ export const LegendContinuous: GCC<LegendContinuousOptions> = (options) => {
       ),
     );
 
+    const layoutWrapper = new G2Layout({
+      style: {
+        x,
+        y,
+        width,
+        height,
+        ...finalLayout,
+        // @ts-ignore
+        subOptions: finalStyle,
+      },
+    });
+
     layoutWrapper.appendChild(
       new Continuous({
         style: finalStyle,
diff --git a/src/component/utils.ts b/src/component/utils.ts
index 174c61fa25..862ff28eba 100644
--- a/src/component/utils.ts
+++ b/src/component/utils.ts
@@ -83,17 +83,21 @@ export function inferComponentLayout(
 }
 
 export class G2Layout extends Layout {
+  get child() {
+    return this.children?.[0] as any;
+  }
+
   update(options: any) {
     this.attr(options);
-    const { width, height, ...restOptions } = options;
-    (this.children?.[0] as any)?.update(restOptions);
+    const { subOptions } = options;
+    this.child?.update(subOptions);
   }
 }
 
-export class LegendCategoryLayout extends Layout {
+export class LegendCategoryLayout extends G2Layout {
   update(options: any) {
-    this.attr(options);
-    (this.children?.[0] as any)?.update(options);
+    const { subOptions } = options;
+    this.child?.update(subOptions);
   }
 }