@fc-plot/ts-graph 0.22.17 → 0.22.19

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fc-plot/ts-graph",
-  "version": "0.22.17",
+  "version": "0.22.19",
   "scripts": {
     "commit": "npx git-cz",
     "compile": "fetk run compile",

package/src/index.ts

@@ -279,7 +279,6 @@ export default class TsGraph {
     const plotleaveType = cascadeScope
       ? `plotleave:${cascadeScope}`
       : "plotleave";
-    const zoomEventType = cascadeScope ? `zoom:${cascadeScope}` : "zoom";
     let mousedownStatus = false;
     let mousedownPos: EventPosition = {} as EventPosition;
     let mouseupPos: EventPosition = {} as EventPosition;
@@ -344,7 +343,14 @@ export default class TsGraph {
         d3.event.stopPropagation();
         const eventPosition = d3.event as EventPosition;
         if (mousedownPos && mousedownPos.layerX !== eventPosition.layerX) {
-          eventEmitter.emit(zoomEventType, mousedownPos, eventPosition);
+          _this.zoom.clearMarker();
+          _this.zoom.onZoom(
+            mousedownPos,
+            eventPosition,
+            (transform: Transform) => {
+              _this.handleZoom(transform, [mousedownPos, eventPosition]);
+            }
+          );
         } else {
           handleClick();
         }
@@ -393,7 +399,14 @@ export default class TsGraph {
 
         // 触发 zoom
         if (mousedownPos && mousedownPos.layerX !== mouseupPos.layerX) {
-          eventEmitter.emit(zoomEventType, mousedownPos, mouseupPos);
+          _this.zoom.clearMarker();
+          _this.zoom.onZoom(
+            mousedownPos,
+            mouseupPos,
+            (transform: Transform) => {
+              _this.handleZoom(transform, [mousedownPos, mouseupPos]);
+            }
+          );
         } else {
           handleClick();
         }
@@ -405,7 +418,6 @@ export default class TsGraph {
     if (cascade) {
       eventEmitter.on(plotmoveType, this.showTooltip);
       eventEmitter.on(plotleaveType, this.hideTooltip);
-      eventEmitter.on(zoomEventType, this.handleZoomEvent);
     }
 
     // TODO: removeListener
@@ -413,7 +425,14 @@ export default class TsGraph {
       if (!isEmpty(mousedownPos)) {
         const eventPosition = mouseleavePos;
         mousedownStatus = false;
-        eventEmitter.emit(zoomEventType, mousedownPos, eventPosition);
+        _this.zoom.clearMarker();
+        _this.zoom.onZoom(
+          mousedownPos,
+          eventPosition,
+          (transform: Transform) => {
+            _this.handleZoom(transform, [mousedownPos, eventPosition]);
+          }
+        );
         mousedownPos = {} as EventPosition;
       }
     });
@@ -464,16 +483,6 @@ export default class TsGraph {
     this.draw(false);
   };
 
-  handleZoomEvent = (
-    mousedownPos: EventPosition,
-    eventPosition: EventPosition
-  ) => {
-    this.zoom.clearMarker();
-    this.zoom.onZoom(mousedownPos, eventPosition, (transform: Transform) => {
-      this.handleZoom(transform, [mousedownPos, eventPosition]);
-    });
-  };
-
   handleZoom = (transform?: Transform, eventPositions?: EventPosition[]) => {
     if (this.options.onZoomWithoutDefult) {
       let times;
@@ -484,7 +493,7 @@ export default class TsGraph {
       }
       this.options.onZoomWithoutDefult(times);
     } else {
-      const { ykey, yAxis, ykeyFormatter } = this.options;
+      const { ykey, ykey2, yAxis, ykeyFormatter } = this.options;
       let { series } = this.options;
       if (transform) {
         this.transform = transform;
@@ -504,6 +513,7 @@ export default class TsGraph {
           for (dataIdx = 0; dataIdx < data.length; dataIdx++) {
             const item = data[dataIdx];
             const y = getYkeyValue(item[ykey], ykeyFormatter);
+
             if (y === null) continue;
             // get axis domain
             if (ymin < y) {
@@ -512,6 +522,16 @@ export default class TsGraph {
             if (ymax > y) {
               ymax = y;
             }
+            if (ykey2) {
+              const y2 = getYkeyValue(item[ykey2], ykeyFormatter);
+              if (y2 === null) continue;
+              if (ymin < y2) {
+                ymin = y2;
+              }
+              if (ymax > y2) {
+                ymax = y2;
+              }
+            }
           }
         }
         // 如果缩放至没有数据点(无法计算出 ymin 和 ymax)，则不更新 domain
@@ -619,9 +639,10 @@ export default class TsGraph {
         let flag = false; // 起始标记，后面有连续空值即丢掉
         let dataIdx;
         for (dataIdx = 0; dataIdx < data.length; dataIdx++) {
-          const ykeyVal = data[dataIdx][oykey]
-            ? data[dataIdx][oykey]
-            : getYkeyValue(data[dataIdx][ykey], ykeyFormatter);
+          const ykeyVal =
+            data[dataIdx][oykey] !== undefined
+              ? data[dataIdx][oykey]
+              : getYkeyValue(data[dataIdx][ykey], ykeyFormatter);
           const item = {
             [xkey]: data[dataIdx][xkey],
             [ykey]: ykeyVal,
@@ -631,7 +652,6 @@ export default class TsGraph {
           if (ykey2 && ykey2 in data[dataIdx]) {
             item[ykey2] = getYkeyValue(data[dataIdx][ykey2], ykeyFormatter);
           }
-
           if (stack.enabled) {
             if (item[oykey] === undefined) {
               item[oykey] = getYkeyValue(item[ykey], ykeyFormatter);
@@ -773,8 +793,7 @@ export default class TsGraph {
       this.options,
       this.handleZoom,
       this.container,
-      this.eventCanvas,
-      eventEmitter
+      this.eventCanvas
     );
   }
 

package/src/zoom.ts

@@ -1,5 +1,4 @@
 import * as d3 from "d3";
-import EventEmitter from "events";
 import { Options, EventPosition, Transform } from "./interface";
 
 type ResetFuncType = (
@@ -11,17 +10,14 @@ export default class Zoom {
   options: Options;
 
   reset: ResetFuncType;
-  eventEmitter: EventEmitter;
 
   constructor(
     userOptions: Options,
     reset: ResetFuncType,
     container: HTMLElement,
-    canvas: HTMLCanvasElement,
-    eventEmitter: EventEmitter
+    canvas: HTMLCanvasElement
   ) {
     this.options = userOptions;
-    this.eventEmitter = eventEmitter;
     this.init(container, canvas);
     this.reset = reset;
   }
@@ -58,32 +54,15 @@ export default class Zoom {
   onReset() {
     const {
       chart: { id },
-      tooltip,
     } = this.options;
     const resetEle = document.getElementById(
       `${id}-zoom-resetBtn`
     ) as HTMLElement;
 
-    const { cascade, cascadeScope } = tooltip;
-    const zoomResetEventType = cascadeScope
-      ? `zoomReset:${cascadeScope}`
-      : "zoomReset";
-
-    if (cascade) {
-      this.eventEmitter.on(zoomResetEventType, () => {
-        this.reset();
-        this.clearResetBtn();
-      });
-    }
-
     resetEle?.addEventListener("click", (e) => {
       e.stopPropagation();
-      if (cascade) {
-        this.eventEmitter.emit(zoomResetEventType, e);
-      } else {
-        this.reset();
-        this.clearResetBtn();
-      }
+      this.reset();
+      this.clearResetBtn();
     });
   }