fix(style): style.fill has higher priority (close: #4667) (#4676)

antvis · May 16, 2023 · 9e10168 · 9e10168
1 parent 12ac82e
commit 9e10168
Show file tree

Hide file tree

Showing 4 changed files with 33 additions and 7 deletions.
diff --git a/__tests__/integration/snapshots/static/alphabetIntervalFill.png b/__tests__/integration/snapshots/static/alphabetIntervalFill.png
diff --git a/__tests__/plots/static/alphabet-interval-fill.ts b/__tests__/plots/static/alphabet-interval-fill.ts
@@ -0,0 +1,21 @@
+import { G2Spec } from '../../../src';
+
+export function alphabetIntervalFill(): G2Spec {
+  return {
+    type: 'interval',
+    transform: [{ type: 'sortX', by: 'y', reverse: true }],
+    data: {
+      type: 'fetch',
+      value: 'data/alphabet.csv',
+    },
+    axis: {
+      y: { labelFormatter: '.0%' },
+    },
+    encode: {
+      x: 'letter',
+      y: 'frequency',
+      color: 'steelblue',
+    },
+    style: { fill: 'red' },
+  };
+}
diff --git a/__tests__/plots/static/index.ts b/__tests__/plots/static/index.ts
@@ -183,3 +183,4 @@ export { population2015IntervalHOMViewLevel } from './population2015-interval-ho
 export { population2015IntervalHOMMarkLevel } from './population2015-interval-hom-mark-level';
 export { population2015IntervalHOMNested } from './population2015-interval-hom-nested';
 export { population2015IntervalHOMMultiple } from './population2015-interval-hom-multiple';
+export { alphabetIntervalFill } from './alphabet-interval-fill';
diff --git a/src/shape/interval/color.ts b/src/shape/interval/color.ts
@@ -147,13 +147,17 @@ export const Color: SC<ColorOptions> = (options) => {
       insetTop,
     };
 
-    return select(rect(points, value, coordinate, extendedStyle))
-      .call(applyStyle, { ...defaults, ...rest })
-      .style(toOpacityKey(options), opacity)
-      .style(colorAttribute, color)
-      .style('lineWidth', lineWidth)
-      .style('stroke', stroke === undefined ? color : stroke)
-      .node();
+    return (
+      select(rect(points, value, coordinate, extendedStyle))
+        .call(applyStyle, defaults)
+        .style(colorAttribute, color)
+        .style(toOpacityKey(options), opacity)
+        .style('lineWidth', lineWidth)
+        .style('stroke', stroke === undefined ? color : stroke)
+        // shape.style has higher priority.
+        .call(applyStyle, rest)
+        .node()
+    );
   };
 };