Merge pull request #3516 from Kingwl/feat/tooltip-filter-range-as-function

feat: support tooltip filter range as function

Author: xile611

docs/assets/option/zh/component/axis-common/linear-axis.md

@@ -75,12 +75,14 @@
 
 使这个轴的 tick 与目标轴保持比例对齐
 
-#${prefix} tooltipFilterRange(number | [number, number])
+#${prefix} tooltipFilterRange(number | [number, number] | (({ scale: IBaseScale }) => number | [number, number]))
 
 **仅当轴为线性轴或时间轴时生效**，配置连续轴上的 dimension tooltip 数据筛选范围。从 1.4.0 版本开始支持。
 
 如果配置为单个数字形如 `d`，则筛选区间为 `[x0 - d, x0 + d]`；如果配置为二元组形如 `[d1, d2]`，则筛选区间为 `[x0 + d1, x0 + d2]`。
 
+如果配置为函数 `f`, 函数的返回值将会作为数据筛选范围的值。
+
 #${prefix} breaks(Array|Object)
 
 自 `1.12.4` 版本开始支持。

packages/vchart-types/types/component/axis/interface.d.ts

@@ -54,7 +54,7 @@ export interface ILinearAxisSpec {
         min?: number;
         max?: number;
     };
-    tooltipFilterRange?: number | [number, number];
+    tooltipFilterRange?: number | [number, number] | ((params: { scale: IBaseScale }) => number | [number, number]);
 }
 export interface IBandAxisSpec {
     bandPadding?: number | number[];

packages/vchart-types/types/component/axis/interface/spec.d.ts

@@ -35,7 +35,7 @@ export interface ILinearAxisSpec {
         min?: number;
         max?: number;
     };
-    tooltipFilterRange?: number | [number, number];
+    tooltipFilterRange?: number | [number, number] | ((params: { scale: IBaseScale }) => number | [number, number]);
     breaks?: ILinearAxisBreakSpec[];
 }
 export interface IBandAxisSpec {

packages/vchart/src/component/axis/interface/spec.ts

@@ -1,4 +1,3 @@
-import { ITextFormatMethod } from './../../../typings/spec/common';
 import type { AxisBreakProps, AxisItem, AxisItemStateStyle } from '@visactor/vrender-components';
 import type { IAnimationSpec } from '../../../animation/spec';
 import type {
@@ -14,6 +13,7 @@ import type {
 } from '../../../typings';
 import type { IComponentSpec } from '../../base/interface';
 import type { AxisType, IAxisItem, IBandAxisLayer, ITickCalculationCfg, StyleCallback } from './common';
+import type { IBaseScale } from '@visactor/vscale';
 
 export interface ICommonAxisSpec extends Omit<IComponentSpec, 'orient' | 'center'>, IAnimationSpec<string, string> {
   /**
@@ -148,9 +148,10 @@ export interface ILinearAxisSpec {
   /**
    * 连续轴上的 dimension tooltip 数据筛选范围
    * 如果配置为单个数字 d，则筛选区间为 [x0 - d, x0 + d]；如果配置为二元组 [d1, d2]，则筛选区间为 [x0 + d1, x0 + d2]
+   * 如果配置为函数 f, 函数的返回值将会作为数据筛选范围的值
    * @since 1.4.0
    */
-  tooltipFilterRange?: number | [number, number];
+  tooltipFilterRange?: number | [number, number] | ((params: { scale: IBaseScale }) => number | [number, number]);
   /**
    * 轴截断配置，只对笛卡尔坐标系的 linear 轴生效
    * @since 1.12.4

packages/vchart/src/event/events/dimension/util/common.ts

@@ -6,6 +6,7 @@ import { isNil, array, isValid, isValidNumber } from '@visactor/vutils';
 import type { Maybe } from '@visactor/vutils';
 import type { AxisComponent } from '../../../../component/axis/base-axis';
 import type { CoordinateType, Datum, ILayoutPoint } from '../../../../typings';
+import type { IBaseScale } from '@visactor/vscale';
 import { isDiscrete } from '@visactor/vscale';
 import type { ICartesianLinearAxisSpec } from '../../../../component';
 import type { ISeries } from '../../../../series';
@@ -42,6 +43,13 @@ export const isSameDimensionInfo = (a?: IDimensionInfo, b?: IDimensionInfo): boo
   return true;
 };
 
+const resolveTooltipFilterRange = (spec: ICartesianLinearAxisSpec, scale: IBaseScale) => {
+  const range = spec.tooltipFilterRange;
+  const rangeValue = typeof range === 'function' ? range({ scale }) : range;
+  const rangeArr = (isValidNumber(rangeValue) ? [-rangeValue, rangeValue] : rangeValue) as Maybe<[number, number]>;
+  return rangeArr;
+};
+
 /** 给定维度项的值，获取对应维度数据 */
 export const getDimensionData = (
   value: any,
@@ -98,13 +106,13 @@ export const getDimensionData = (
             });
           } else {
             // 散点图情况，依据轴上的配置判断
-            const range = (axis.getSpec() as ICartesianLinearAxisSpec).tooltipFilterRange;
-            const rangeArr = (isValidNumber(range) ? [-range, range] : range) as Maybe<[number, number]>;
+            const spec = axis.getSpec() as ICartesianLinearAxisSpec;
+            const rangeArr = resolveTooltipFilterRange(spec, scale);
             let datums: Datum[] = [];
             let datumIdList: number[] = [];
             if (rangeArr) {
               // 根据范围取 datum
-              viewData.forEach((datum: any, i: number) => {
+              viewData.forEach((datum: Datum, i: number) => {
                 if (isValid(datum[dimensionField[0]])) {
                   const delta = datum[dimensionField[0]] - value;
                   if (delta >= rangeArr[0] && delta <= rangeArr[1]) {