fix: 双轴图 label 支持 formatter

Author: aiyin.lzy

__tests__/bugs/issue-2021-spec.ts

@@ -1,5 +1,4 @@
 import { TinyLine, TinyArea, TinyColumn } from '../../src';
-import { CountryEconomy } from '../data/country-economy';
 import { createDiv } from '../utils/dom';
 
 const DATA = [

__tests__/unit/plots/dual-axes/column-spec.ts

@@ -25,9 +25,19 @@ describe('Line-Column', () => {
           connectNulls: false,
           smooth: true,
           color: '#f00',
+          label: {
+            formatter: (datum) => {
+              return `${datum.pv}个`;
+            },
+          },
         },
         {
           geometry: 'column',
+          label: {
+            formatter: (datum) => {
+              return `${datum.uv}*`;
+            },
+          },
         },
       ],
     });
@@ -47,6 +57,15 @@ describe('Line-Column', () => {
     expect(leftGeometry.shapeType).toBe('line');
     expect(rightGeometry.shapeType).toBe('interval');
 
+    // @ts-ignore
+    expect(leftGeometry.labelOption.fields).toEqual(['pv']);
+    // @ts-ignore
+    expect(leftGeometry.labelOption.cfg.formatter(PV_DATA[0])).toBe('123000个');
+    // @ts-ignore
+    expect(rightGeometry.labelOption.fields).toEqual(['uv']);
+    // @ts-ignore
+    expect(rightGeometry.labelOption.cfg.formatter(UV_DATA[0])).toBe('1212*');
+
     dualAxes.destroy();
   });
 

__tests__/unit/plots/dual-axes/interaction-spec.ts

@@ -1,4 +1,4 @@
-import { DualAxes, Plot } from '../../../../src';
+import { DualAxes } from '../../../../src';
 import { PV_DATA, UV_DATA } from '../../../data/pv-uv';
 import { createDiv } from '../../../utils/dom';
 

__tests__/unit/plots/funnel/compare-spec.ts

@@ -60,7 +60,7 @@ describe('compare funnel', () => {
         };
 
         const { data } = funnel.chart.getOptions();
-        data.forEach((item, index) => {
+        data.forEach((item) => {
           const originData = origin[item.quarter];
           const originIndex = originData.findIndex((jtem) => jtem.pv === item.pv);
           expect(item[FUNNEL_PERCENT]).toEqual(item.pv / originData[0].pv);

__tests__/unit/plots/gauge/shapes/index-spec.ts

@@ -1,5 +1,4 @@
 import { Gauge } from '../../../../../src';
-import { pick } from '../../../../../src/utils';
 import { createDiv } from '../../../../utils/dom';
 
 describe('gauge', () => {

__tests__/unit/plots/pie/html-statistic-spec.ts

@@ -3,7 +3,6 @@ import { Pie } from '../../../../src';
 import { StatisticAction } from '../../../../src/plots/pie/interactions/pie-statistic-action';
 import { POSITIVE_NEGATIVE_DATA } from '../../../data/common';
 import { createDiv } from '../../../utils/dom';
-import { delay } from '../../../utils/delay';
 
 describe('html-statistics', () => {
   const div = createDiv();

examples/dual-axes/dual-line/demo/custom-dual-line.ts

@@ -21,6 +21,11 @@ const dualAxes = new DualAxes('container', {
       geometry: 'line',
       smooth: false,
       color: '#5B8FF9',
+      label: {
+        formatter: (datum) => {
+          return `${datum.value}个`;
+        },
+      },
       lineStyle: {
         lineWidth: 3,
         lineDash: [5, 5],
@@ -34,7 +39,11 @@ const dualAxes = new DualAxes('container', {
         lineWidth: 4,
         opacity: 0.5,
       },
-      label: {},
+      label: {
+        formatter: (datum) => {
+          return `${datum.count}个`;
+        },
+      },
       point: {
         shape: 'circle',
         size: 4,

src/plots/dual-axes/util/geometry.ts

@@ -2,7 +2,7 @@ import { each } from '@antv/util';
 import { Geometry } from '@antv/g2';
 import { Params } from '../../../core/adaptor';
 import { point, line, interval } from '../../../adaptor/geometries';
-import { pick, findGeometry, deepAssign } from '../../../utils';
+import { pick, deepAssign } from '../../../utils';
 import { GeometryOption } from '../types';
 import { isLine, isColumn } from './option';
 
@@ -14,7 +14,7 @@ export function drawSingleGeometry<O extends { xField: string; yField: string; g
   params: Params<O>
 ): Params<O> {
   const { options, chart } = params;
-  const { geometryOption, yField } = options;
+  const { geometryOption } = options;
   const { isStack, color, seriesField, groupField, isGroup } = geometryOption;
 
   const FIELD_KEY = ['xField', 'yField'];
@@ -83,18 +83,5 @@ export function drawSingleGeometry<O extends { xField: string; yField: string; g
     );
   }
 
-  // 绘制 label
-  const mainGeometry = findGeometry(chart, 'line') || findGeometry(chart, 'interval');
-  if (!geometryOption.label) {
-    mainGeometry.label(false);
-  } else {
-    const { callback, ...cfg } = geometryOption.label;
-    mainGeometry.label({
-      fields: [yField],
-      callback,
-      cfg,
-    });
-  }
-
   return params;
 }