fix: update legend component inferring strategies (#4906)

* fix: add extra rules to avoid unexcept component inferring

* refactor: update legend inferring config

__tests__/plots/static/body-point-scatter-plot.ts

@@ -0,0 +1,19 @@
+import { G2Spec } from '../../../src';
+
+export function bodyPointScatterPlot(): G2Spec {
+  return {
+    type: 'point',
+    data: {
+      type: 'fetch',
+      value: 'data/body.json',
+    },
+    encode: {
+      x: 'height',
+      y: 'weight',
+      size: 'weight',
+      color: 'red',
+    },
+  };
+}
+
+bodyPointScatterPlot.maxError = 100;

__tests__/plots/static/index.ts

@@ -5,6 +5,7 @@ export { alphabetIntervalLabelContrastReverse } from './alphabet-interval-label-
 export { alphabetIntervalDataSort } from './alphabet-interval-data-sort';
 export { alphabetIntervalFunnel } from './alphabet-interval-funnel';
 export { alphabetIntervalPyramid } from './alphabet-interval-pyramid';
+export { bodyPointScatterPlot } from './body-point-scatter-plot';
 export { gammaRandomLineSortXQuantitative } from './gamma-random-line-sortx-quantitative';
 export { alphabetIntervalTransposed } from './alphabet-interval-transposed';
 export { stateAgesIntervalStacked } from './stateages-interval-stacked';

src/component/constant.ts

@@ -0,0 +1,237 @@
+// [legend type, [channels, scale type][][]]
+type InferStrategy = [string, [string, string][][]];
+
+/**
+ * @examples
+ * ✅
+ * color - `discrete`, shape - `constant`
+ * legendCategory.rule[27] is matched
+ *
+ * ❎
+ * shape - `discrete`, size - `constant`
+ * There are no rules to match
+ *
+ */
+export const LEGEND_INFER_STRATEGIES: InferStrategy[] = [
+  [
+    'legendCategory',
+    [
+      [
+        ['color', 'discrete'],
+        ['opacity', 'discrete'],
+        ['shape', 'discrete'],
+        ['size', 'constant'],
+      ],
+      [
+        ['color', 'discrete'],
+        ['opacity', 'constant'],
+        ['shape', 'discrete'],
+        ['size', 'constant'],
+      ],
+      [
+        ['color', 'discrete'],
+        ['opacity', 'discrete'],
+        ['shape', 'constant'],
+        ['size', 'constant'],
+      ],
+      [
+        ['color', 'discrete'],
+        ['opacity', 'constant'],
+        ['shape', 'constant'],
+        ['size', 'constant'],
+      ],
+      [
+        ['color', 'constant'],
+        ['opacity', 'discrete'],
+        ['shape', 'discrete'],
+        ['size', 'constant'],
+      ],
+      [
+        ['color', 'constant'],
+        ['opacity', 'constant'],
+        ['shape', 'discrete'],
+        ['size', 'constant'],
+      ],
+      [
+        ['color', 'constant'],
+        ['opacity', 'discrete'],
+        ['shape', 'constant'],
+        ['size', 'constant'],
+      ],
+      [
+        ['color', 'discrete'],
+        ['shape', 'discrete'],
+        ['size', 'constant'],
+      ],
+      [
+        ['color', 'discrete'],
+        ['opacity', 'discrete'],
+        ['shape', 'discrete'],
+      ],
+      [
+        ['color', 'discrete'],
+        ['opacity', 'discrete'],
+        ['size', 'constant'],
+      ],
+      [
+        ['color', 'discrete'],
+        ['opacity', 'constant'],
+        ['shape', 'discrete'],
+      ],
+      [
+        ['color', 'discrete'],
+        ['opacity', 'constant'],
+        ['size', 'constant'],
+      ],
+      [
+        ['color', 'discrete'],
+        ['shape', 'constant'],
+        ['size', 'constant'],
+      ],
+      [
+        ['color', 'discrete'],
+        ['opacity', 'discrete'],
+        ['shape', 'constant'],
+      ],
+      [
+        ['color', 'discrete'],
+        ['opacity', 'constant'],
+        ['shape', 'constant'],
+      ],
+      [
+        ['color', 'constant'],
+        ['shape', 'discrete'],
+        ['size', 'constant'],
+      ],
+      [
+        ['color', 'constant'],
+        ['opacity', 'discrete'],
+        ['shape', 'discrete'],
+      ],
+      [
+        ['color', 'constant'],
+        ['opacity', 'discrete'],
+        ['size', 'constant'],
+      ],
+      [
+        ['color', 'constant'],
+        ['opacity', 'constant'],
+        ['shape', 'discrete'],
+      ],
+      // [
+      //   ['color', 'constant'],
+      //   ['opacity', 'constant'],
+      //   ['size', 'constant'],
+      // ],
+      // [
+      //   ['color', 'constant'],
+      //   ['shape', 'constant'],
+      //   ['size', 'constant'],
+      // ],
+      [
+        ['color', 'constant'],
+        ['opacity', 'discrete'],
+        ['shape', 'constant'],
+      ],
+      [
+        ['color', 'discrete'],
+        ['shape', 'discrete'],
+      ],
+      [
+        ['color', 'discrete'],
+        ['size', 'constant'],
+      ],
+      [
+        ['color', 'discrete'],
+        ['opacity', 'discrete'],
+      ],
+      [
+        ['color', 'discrete'],
+        ['opacity', 'constant'],
+      ],
+      [
+        ['color', 'discrete'],
+        ['shape', 'constant'],
+      ],
+      [
+        ['color', 'constant'],
+        ['shape', 'discrete'],
+      ],
+      [
+        ['color', 'constant'],
+        ['size', 'constant'],
+      ],
+      [
+        ['color', 'constant'],
+        ['opacity', 'discrete'],
+      ],
+      // [
+      //   ['color', 'constant'],
+      //   ['opacity', 'constant'],
+      // ],
+      // [
+      //   ['color', 'constant'],
+      //   ['shape', 'constant'],
+      // ],
+      [['color', 'discrete']],
+      // [['color', 'constant']],
+    ],
+  ],
+  [
+    'legendContinuousSize',
+    [
+      [
+        ['color', 'continuous'],
+        ['opacity', 'continuous'],
+        ['size', 'continuous'],
+      ],
+      [
+        ['color', 'constant'],
+        ['opacity', 'continuous'],
+        ['size', 'continuous'],
+      ],
+      [
+        ['color', 'continuous'],
+        ['size', 'continuous'],
+      ],
+      [
+        ['color', 'constant'],
+        ['size', 'continuous'],
+      ],
+    ],
+  ],
+  [
+    'legendContinuousBlockSize',
+    [
+      [
+        ['color', 'distribution'],
+        ['opacity', 'distribution'],
+        ['size', 'distribution'],
+      ],
+      [
+        ['color', 'distribution'],
+        ['size', 'distribution'],
+      ],
+    ],
+  ],
+  [
+    'legendContinuousBlock',
+    [
+      [
+        ['color', 'distribution'],
+        ['opacity', 'continuous'],
+      ],
+      [['color', 'distribution']],
+    ],
+  ],
+  [
+    'legendContinuous',
+    [
+      [
+        ['color', 'continuous'],
+        ['opacity', 'continuous'],
+      ],
+      [['color', 'continuous']],
+    ],
+  ],
+];

src/component/legendContinuousBlockSize.ts

@@ -1,14 +1,13 @@
 import { GuideComponentComponent as GCC } from '../runtime';
 import { LegendContinuous, LegendContinuousOptions } from './legendContinuous';
+import { LegendContinuousSize } from './legendContinuousSize';
 
 export type LegendContinuousBlockSizeOptions = LegendContinuousOptions;
 
 export const LegendContinuousBlockSize: GCC<
   LegendContinuousBlockSizeOptions
 > = (options) => {
-  return LegendContinuous(
-    Object.assign({}, { type: 'size', block: true, tick: false }, options),
-  );
+  return LegendContinuousSize(Object.assign({}, { block: true }, options));
 };
 
 LegendContinuousBlockSize.props = {

src/component/legendContinuousSize.ts

@@ -1,23 +1,32 @@
 import { GuideComponentComponent as GCC } from '../runtime';
+import { scaleOf } from './utils';
 import { LegendContinuous, LegendContinuousOptions } from './legendContinuous';
 
 export type LegendContinuousSizeOptions = LegendContinuousOptions;
 
 export const LegendContinuousSize: GCC<LegendContinuousSizeOptions> = (
   options,
 ) => {
-  return LegendContinuous(
-    Object.assign(
-      {},
-      {
-        type: 'size',
-        tick: false,
-        labelFilter: (datum, index, data) =>
-          index === 0 || index === data.length - 1,
-      },
-      options,
-    ),
-  );
+  return (context) => {
+    const { scales } = context;
+    const sizeScale = scaleOf(scales, 'size');
+    return LegendContinuous(
+      Object.assign(
+        {},
+        {
+          type: 'size',
+          tick: false,
+          data: sizeScale.getOptions().domain.map((value, index) => ({
+            value,
+            label: String(value),
+          })),
+          labelFilter: (datum, index, data) =>
+            index === 0 || index === data.length - 1,
+        },
+        options,
+      ),
+    )(context);
+  };
 };
 
 LegendContinuousSize.props = {