@fc-plot/ts-graph 0.22.15 → 0.22.16

package/package.json

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

package/src/index.ts

@@ -35,7 +35,6 @@ import {
   getYkeyValue,
   getNearestPointsByEvent,
 } from "./utils";
-import getNearestPoints from "./getNearestPoints";
 import "../assets/style.less";
 
 const eventEmitter = new EventEmitter();

package/src/tooltip.ts

@@ -9,6 +9,7 @@ import {
 import { Options, EventPosition, Point, XScales, YScales } from "./interface";
 import TsGraph from "./index";
 import getNearestPoints from "./getNearestPoints";
+import { getPointsByTime } from "./utils";
 
 export default class Tooltip {
   options: Options;
@@ -67,7 +68,8 @@ export default class Tooltip {
     eventPosition: EventPosition,
     xScales: XScales,
     yScales: YScales,
-    cbk: (nearestPoints: Point[]) => void
+    cbk: (nearestPoints: Point[]) => void,
+    forceTimestamp?: number
   ) {
     const {
       series = [],
@@ -80,23 +82,28 @@ export default class Tooltip {
       timestamp,
       fillNull,
     } = this.options;
-    // const containerRect = this.container.getBoundingClientRect();
     const offsetX = eventPosition.offsetX || eventPosition.layerX;
     const x = xScales.invert(offsetX);
     let nearestPoints: Point[] = [];
 
     if (this.isMouserover === false) return;
+    let tempNearestPoints: any[] = [];
+    if (forceTimestamp) {
+      tempNearestPoints = getPointsByTime(forceTimestamp, this.options);
+    } else {
+      tempNearestPoints = getNearestPoints({
+        x,
+        xkey,
+        ykey,
+        ykey2,
+        oykey,
+        timestamp,
+        series,
+        fillNull,
+      });
+    }
 
-    nearestPoints = getNearestPoints({
-      x,
-      xkey,
-      ykey,
-      ykey2,
-      oykey,
-      timestamp,
-      series,
-      fillNull,
-    }).map((item: any) => {
+    nearestPoints = tempNearestPoints.map((item: any) => {
       return {
         ...item,
         x: xScales(item.timestamp),
@@ -149,26 +156,25 @@ export default class Tooltip {
   draw(
     eventPosition: EventPosition,
     instance: TsGraph,
-    forceTimestamp?: number,
-    cbk?: (nearestPoints: Point[]) => void
+    forceTimestamp?: number
   ) {
     const { xScales, yScales, yAxis } = instance;
     this.isMouserover = true;
-    this.getNearestPoints(eventPosition, xScales, yScales, (nearestPoints) => {
-      this.clear();
-      if (nearestPoints.length) {
-        if (nearestPoints[0].x < yAxis.tickMaxWidth) return; // 判断是否在 y 轴上
-        if (forceTimestamp && nearestPoints[0].timestamp !== forceTimestamp) {
-          return;
+    this.getNearestPoints(
+      eventPosition,
+      xScales,
+      yScales,
+      (nearestPoints) => {
+        this.clear();
+        if (nearestPoints.length) {
+          if (nearestPoints[0].x < yAxis.tickMaxWidth) return; // 判断是否在 y 轴上
+          this.drawCrosshair(nearestPoints[0].x);
+          this.drawSymbol(nearestPoints);
+          this.drawModal(nearestPoints, eventPosition);
         }
-        this.drawCrosshair(nearestPoints[0].x);
-        this.drawSymbol(nearestPoints);
-        this.drawModal(nearestPoints, eventPosition);
-      }
-      if (cbk && Object.prototype.toString.call(cbk) === "[object Function]") {
-        cbk(nearestPoints);
-      }
-    });
+      },
+      forceTimestamp
+    );
   }
 
   drawModal(nearestPoints: Point[], eventPosition: EventPosition) {

package/src/utils.ts

@@ -1,6 +1,12 @@
 import * as d3 from "d3";
-import { max } from "lodash";
-import { Timestamp, Options, XScales, YScales } from "./interface";
+import { max, pickBy } from "lodash";
+import {
+  Timestamp,
+  Options,
+  XScales,
+  YScales,
+  NearestPoint,
+} from "./interface";
 import getNearestPoints from "./getNearestPoints";
 
 type Point = {
@@ -148,3 +154,33 @@ export function getNearestPointsByEvent(
     nearestPoints,
   };
 }
+
+export function getPointsByTime(time: number, options: Options) {
+  const { series = [], xkey, ykey, oykey, timestamp } = options;
+  const points: NearestPoint[] = [];
+  series.forEach((serie, i) => {
+    if (serie.visible === false) return;
+    const { name, color } = serie;
+    const serieWithEffective = pickBy(serie, (_val: string, key: string) => {
+      return key !== "data";
+    });
+    let { data = [] } = serie;
+    if (Object.prototype.toString.call(data) !== "[object Array]") return;
+    data.forEach((item) => {
+      const x = getMsTs(item[xkey], timestamp);
+      if (x === time) {
+        points.push({
+          ...item,
+          name,
+          color,
+          timestamp: x,
+          value: item[ykey],
+          origin: item[oykey],
+          serieIndex: i,
+          serieOptions: serieWithEffective,
+        });
+      }
+    });
+  });
+  return points;
+}