fix(radial-bar): 修复玉钰图存在非法数据崩溃问题 (#2394) (#2447)

* fix(radial-bar): filter illegal data (#2394)

* fix(radial-bar): 过滤不合法数据不包含null，单测增加断言

__tests__/bugs/issue-2394-spec.ts

@@ -0,0 +1,43 @@
+import { RadialBar } from '../../src';
+import { createDiv } from '../utils/dom';
+
+describe('#2394', () => {
+  it('filter illegal data', () => {
+    const data = [
+      { name: 'X6', star: '297a' },
+      { name: 'G', star: NaN },
+      { name: 'G2Plot', star: undefined },
+      { name: 'L7', star: '0' },
+      { name: 'AVA', star: null },
+      { name: 'G6', star: 0 },
+      { name: 'F2', star: 7346 },
+      { name: 'G2', star: 10178 },
+    ];
+
+    const radialBar = new RadialBar(createDiv(), {
+      data,
+      xField: 'name',
+      yField: 'star',
+      // maxAngle: 90, //最大旋转角度,
+      radius: 0.8,
+      innerRadius: 0.2,
+      tooltip: {
+        formatter: (datum) => {
+          return { name: 'star数', value: datum.star };
+        },
+      },
+    });
+
+    radialBar.render();
+
+    expect(radialBar.chart.geometries[0].elements.length).toBe(4);
+    expect(radialBar.chart.geometries[0].data.length).toBe(4);
+
+    // null认为是0，不过滤
+    expect(radialBar.chart.geometries[0].data[0].star).toBeNull();
+
+    expect(radialBar.chart.geometries[0].data[1].star).toBe(0);
+
+    radialBar.destroy();
+  });
+});

src/plots/radial-bar/adaptor.ts

@@ -1,18 +1,39 @@
+import { filter } from '@antv/util';
 import { interaction, animation, theme, scale, tooltip, legend, annotation } from '../../adaptor/common';
 import { Params } from '../../core/adaptor';
-import { flow, deepAssign, findGeometry, transformLabel } from '../../utils';
+import { flow, deepAssign, findGeometry, transformLabel, log, LEVEL } from '../../utils';
 import { interval, point } from '../../adaptor/geometries';
 import { RadialBarOptions } from './types';
 import { getScaleMax } from './utils';
+/**
+ * data 处理，过滤非法数据
+ * @param params
+ */
+function data(params: Params<RadialBarOptions>): Params<RadialBarOptions> {
+  const { chart, options } = params;
+  const { data } = options;
+  const { yField } = options;
+
+  const processData = filter(data, (d) => {
+    const v = d[yField];
+    return (typeof v === 'number' && !isNaN(v)) || v === null;
+  });
+
+  // 打印异常数据情况
+  log(LEVEL.WARN, processData.length === data.length, 'illegal data existed in chart data.');
+
+  chart.data(processData);
+
+  return params;
+}
 
 /**
  * geometry 处理
  * @param params
  */
 function geometry(params: Params<RadialBarOptions>): Params<RadialBarOptions> {
   const { chart, options } = params;
-  const { data, barStyle: style, color, tooltip, colorField, type, xField, yField } = options;
-  chart.data(data);
+  const { barStyle: style, color, tooltip, colorField, type, xField, yField } = options;
   const p = deepAssign({}, params, {
     options: {
       tooltip,
@@ -43,8 +64,11 @@ function geometry(params: Params<RadialBarOptions>): Params<RadialBarOptions> {
  * @param params
  */
 export function meta(params: Params<RadialBarOptions>): Params<RadialBarOptions> {
-  const { options } = params;
-  const { yField, data, maxAngle } = options;
+  const { options, chart } = params;
+  const { yField, maxAngle } = options;
+
+  // data使用chart.data()之后的，因为原始data中可能存在非法数据
+  const { data } = chart.getOptions();
   return flow(
     scale({
       [yField]: {
@@ -123,6 +147,7 @@ function label(params: Params<RadialBarOptions>): Params<RadialBarOptions> {
  */
 export function adaptor(params: Params<RadialBarOptions>) {
   return flow(
+    data,
     geometry,
     meta,
     axis,