feat(chart): 去除 DoubleOverlapArea cursor 配置，由 markArea 实现

Author: wangxingkang

docs/custom/demo/DoubleOverlapArea/event.tsx

@@ -140,7 +140,10 @@ function Example() {
   };
 
   const handleDimensionClick: DoubleOverlapAreaProps['onDimensionClick'] = (e) => {
-    if (e?.model?.userId === 'area2' || e.node.type === 'line') {
+    const datum = e.dimensionInfo[0];
+
+    // 根据数据判断
+    if (datum && datum.value >= 2 && datum.value <= 22) {
       const val = e.dimensionInfo[0].value;
       if (getSelectVal() === val) {
         setSelectVal(null);
@@ -156,9 +159,20 @@ function Example() {
   return (
     <DoubleOverlapArea
       {...spec}
-      cursor="pointer"
       markLine={markLine}
       onDimensionClick={handleDimensionClick}
+      markArea={[
+        {
+          x: 2,
+          x1: 22,
+          area: {
+            style: {
+              fillOpacity: 0,
+              cursor: 'pointer',
+            },
+          },
+        },
+      ]}
       crosshair={[
         {
           xField: {

packages/chart/src/DoubleOverlapArea/index.tsx

@@ -1,16 +1,14 @@
 import type { CommonChartProps } from '@visactor/react-vchart';
-import type { Cursor } from '@visactor/vchart/esm/typings/cursor';
 import type { ICartesianAxisSpec } from './types';
 import { CommonChart } from '@visactor/react-vchart';
 import { merge } from '@visactor/vutils';
-import React, { useMemo } from 'react';
+import React from 'react';
 import { defaultCrosshair, defaultTooltip } from './config';
 import { getDefaultProps } from './utils';
 
 export interface DoubleOverlapAreaProps extends CommonChartProps {
   xField?: string | string[];
   yField?: string | string[];
-  cursor?: Cursor;
   /**
    * 坐标轴 X 轴配置
    */
@@ -28,25 +26,23 @@ export function DoubleOverlapArea(props: DoubleOverlapAreaProps) {
     yAxes,
     xField = 'date',
     yField = 'value',
-    cursor = 'default',
     tooltip,
     crosshair = defaultCrosshair,
     ...rest
   } = props;
 
   const tooltipProps = merge({}, defaultTooltip, tooltip);
 
-  const defaultProps = useMemo(
+  const defaultProps = React.useMemo(
     () => {
       return getDefaultProps({
         yAxes,
         xAxes,
         xField,
         yField,
-        cursor,
       });
     },
-    [yAxes, xAxes, xField, yField, cursor],
+    [yAxes, xAxes, xField, yField],
   );
 
   return (

packages/chart/src/DoubleOverlapArea/utils.ts

@@ -1,5 +1,4 @@
 import type { CommonChartProps } from '@visactor/react-vchart';
-import type { Cursor } from '@visactor/vchart/esm/typings/cursor';
 import type { ICartesianAxisSpec } from './types';
 import { colorBlue2, colorGrey04 } from '@sensoro-design/chart-theme';
 import { merge } from '@visactor/vutils';
@@ -10,11 +9,10 @@ interface Params {
   yAxes?: Partial<ICartesianAxisSpec>;
   xField?: string | string[];
   yField?: string | string[];
-  cursor?: Cursor;
 }
 
 export function getDefaultProps(params: Params) {
-  const { xAxes = {}, yAxes = {}, xField, yField, cursor } = params;
+  const { xAxes = {}, yAxes = {}, xField, yField } = params;
 
   const defaultXAxes = {
     orient: 'bottom',
@@ -75,7 +73,6 @@ export function getDefaultProps(params: Params) {
           ...defaultArea,
           style: {
             ...defaultArea.style,
-            cursor,
           },
         },
         point: {