fix(chart): 修复 gesture 重复创建 (#1820)

antvis · Jul 27, 2023 · 8fa1e63 · 8fa1e63
1 parent fd89b46
commit 8fa1e63
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 7 deletions.
diff --git a/packages/f2/src/chart/index.tsx b/packages/f2/src/chart/index.tsx
@@ -6,7 +6,6 @@ import {
   Component,
   Children,
   jsx,
-  Gesture,
   Ref,
   createRef,
 } from '@antv/f-engine';
@@ -63,7 +62,6 @@ class Chart<
   public coord: CoordController;
   public scale: ScaleController;
 
-  public gesture: Gesture;
   public coordRef: Ref;
   constructor(props: IProps, context?: IContext) {
     super(props);
@@ -141,12 +139,17 @@ class Chart<
   }
 
   on(eventName: string, listener: (...args: any[]) => void) {
-    this.gesture = this.gesture ? this.gesture : new Gesture(this.coordRef.current);
-    this.gesture.on(eventName, listener);
+    const roolEl = this.coordRef.current;
+    if (!roolEl || !roolEl.gesture) return;
+    const gesture = roolEl.gesture;
+    gesture.on(eventName, listener);
   }
 
   off(eventName: string, listener: (...args: any[]) => void) {
-    this.gesture.off(eventName, listener);
+    const roolEl = this.coordRef.current;
+    if (!roolEl || !roolEl.gesture) return;
+    const gesture = roolEl.gesture;
+    gesture.off(eventName, listener);
   }
 
   // 给需要显示的组件留空

diff --git a/site/examples/candlestick/candlestick/demo/base.jsx b/site/examples/candlestick/candlestick/demo/base.jsx
@@ -26,8 +26,8 @@ const data = [
 const { props } = (
   <Canvas context={context} pixelRatio={window.devicePixelRatio}>
     <Chart data={data}>
-      <Axis field="time" />
-      <Axis field="value" />
+      <Axis field="time" type="timeCat" />
+      <Axis field="value" formatter={(v) => Number(v).toFixed(0)} />
       <Candlestick x="time" y="value" />
       <Tooltip showCrosshairs={true} yPositionType="coord" crosshairsType="xy" showXTip showYTip />
     </Chart>