fix(Area): 修复面积图 x 为空时，图形不绘制 (#1870)

Author: zengyue

packages/f2/src/components/line/withLine.tsx

@@ -29,7 +29,11 @@ export default (View) => {
         const tmpPoints = [];
         for (let i = 0, len = points.length; i < len; i++) {
           const point = points[i];
-          const { y } = point;
+          const { x, y } = point;
+          // 过滤 x 为 NaN 的点
+          if (isNaN(x)) {
+            continue;
+          }
           if (isArray(y)) {
             if (isNaN(y[0])) {
               continue;
@@ -51,7 +55,11 @@ export default (View) => {
       let tmpPoints = [];
       for (let i = 0, len = points.length; i < len; i++) {
         const point = points[i];
-        const { y } = point;
+        const { x, y } = point;
+        // 过滤 x 为 NaN 的点
+        if (isNaN(x)) {
+          continue;
+        }
         if (isArray(y)) {
           if (isNaN(y[0])) {
             if (tmpPoints.length) {

packages/f2/test/issues/1867.test.tsx

@@ -0,0 +1,66 @@
+import { jsx, Canvas, Chart, Axis, Area } from '../../src';
+import { createContext, delay } from '../util';
+
+const data = [
+  {
+    dt: '20231008',
+    date: '10-08',
+    value: 1.31,
+  },
+  {
+    dt: '20231009',
+    date: '10-09',
+    value: 57.5,
+  },
+  {
+    dt: '20231010',
+    // date: '10-10',
+    value: 151.83,
+  },
+  {
+    dt: '20231011',
+    date: '10-11',
+    value: 291.6,
+  },
+  {
+    dt: '20231012',
+    date: '10-12',
+    value: 45.62,
+  },
+  {
+    dt: '20231013',
+    date: '10-13',
+    value: 7.4,
+  },
+  {
+    dt: '20231007',
+    // data: '10-07',
+    value: 9,
+  },
+];
+
+describe('x 轴字段不存在', () => {
+  it('x 轴字段不存在', async () => {
+    const context = createContext();
+    const { props } = (
+      <Canvas context={context} pixelRatio={1}>
+        <Chart data={data}>
+          <Axis
+            field="date"
+            style={{
+              label: { align: 'between' },
+            }}
+          />
+          <Area x="date" y="value" color="l(90) 0:#1890FF 1:#f7f7f7" />
+        </Chart>
+      </Canvas>
+    );
+
+    const canvas = new Canvas(props);
+    canvas.render();
+
+    await delay(1000);
+
+    expect(context).toMatchImageSnapshot();
+  });
+});