opt: opt x-axis display

klinecharts · Dec 18, 2024 · 50939db · 50939db
1 parent d923662
commit 50939db
Show file tree

Hide file tree

Showing 5 changed files with 49 additions and 39 deletions.
diff --git a/src/Store.ts b/src/Store.ts
@@ -282,6 +282,8 @@ export default class StoreImp implements Store {
 
   private _timeWeightTickList: TimeWeightTick[] = []
 
+  private _minTimeDifference = Number.MAX_SAFE_INTEGER
+
   /**
    * Visible data array
    */
@@ -541,23 +543,6 @@ export default class StoreImp implements Store {
       }
     }
     if (success) {
-      if (dataLengthChange > 0) {
-        this._overlays.forEach(overlays => {
-          overlays.forEach(overlay => {
-            const points = overlay.points
-            points.forEach(point => {
-              if (!isValid(point.timestamp) && isValid(point.dataIndex)) {
-                if (type === LoadDataType.Forward) {
-                  point.dataIndex = point.dataIndex + dataLengthChange
-                }
-                const data = this._dataList[point.dataIndex]
-                // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition -- ignore
-                point.timestamp = data?.timestamp
-              }
-            })
-          })
-        })
-      }
       if (adjustFlag) {
         this._adjustVisibleRange()
         this.setCrosshair(this._crosshair, true)
@@ -592,19 +577,19 @@ export default class StoreImp implements Store {
 
   private _classifyTimeWeightTicks (newDataList: KLineData[], isUpdate?: boolean): void {
     let baseDataIndex = 0
-    let prevKLineData: Nullable<KLineData> = null
+    let prevDateTime: Nullable<DateTime> = null
+    let prevTimestamp: Nullable<number> = null
     if (isUpdate ?? false) {
       baseDataIndex = this._dataList.length
-      prevKLineData = this._dataList[baseDataIndex - 1]
     } else {
       this._timeWeightTickMap.clear()
+      this._minTimeDifference = Number.MAX_SAFE_INTEGER
     }
     for (let i = 0; i < newDataList.length; i++) {
-      const kLineData = newDataList[i]
+      const timestamp = newDataList[i].timestamp
       let weight = TimeWeightConstants.Second
-      const dateTime = formatTimestampToDateTime(this._dateTimeFormat, kLineData.timestamp)
-      if (isValid(prevKLineData)) {
-        const prevDateTime = formatTimestampToDateTime(this._dateTimeFormat, prevKLineData.timestamp)
+      const dateTime = formatTimestampToDateTime(this._dateTimeFormat, timestamp)
+      if (isValid(prevDateTime)) {
         if (dateTime.YYYY !== prevDateTime.YYYY) {
           weight = TimeWeightConstants.Year
         } else if (dateTime.MM !== prevDateTime.MM) {
@@ -619,10 +604,14 @@ export default class StoreImp implements Store {
           weight = TimeWeightConstants.Second
         }
       }
+      if (isNumber(prevTimestamp)) {
+        this._minTimeDifference = Math.min(this._minTimeDifference, timestamp - prevTimestamp)
+      }
       const currentTimeWeightList = this._timeWeightTickMap.get(weight) ?? []
-      currentTimeWeightList.push({ dataIndex: i + baseDataIndex, weight, dateTime, timestamp: kLineData.timestamp })
+      currentTimeWeightList.push({ dataIndex: i + baseDataIndex, weight, dateTime, timestamp })
       this._timeWeightTickMap.set(weight, currentTimeWeightList)
-      prevKLineData = kLineData
+      prevDateTime = dateTime
+      prevTimestamp = timestamp
     }
     this._buildTimeWeightTickList()
   }
@@ -903,21 +892,44 @@ export default class StoreImp implements Store {
   }
 
   dataIndexToTimestamp (dataIndex: number): Nullable<number> {
+    const length = this._dataList.length
+    if (length === 0) {
+      return null
+    }
     const data = this.getDataByDataIndex(dataIndex)
-    return data?.timestamp ?? null
+    if (isValid(data)) {
+      return data.timestamp
+    }
+    const lastIndex = length - 1
+    if (dataIndex > lastIndex) {
+      return this._dataList[lastIndex].timestamp + this._minTimeDifference * (dataIndex - lastIndex)
+    }
+    if (dataIndex < 0) {
+      return this._dataList[0].timestamp - this._minTimeDifference * Math.abs(dataIndex)
+    }
+    return null
   }
 
   timestampToDataIndex (timestamp: number): number {
-    if (this._dataList.length === 0) {
+    const length = this._dataList.length
+    if (length === 0) {
       return 0
     }
+    const lastIndex = length - 1
+    const lastTimestamp = this._dataList[lastIndex].timestamp
+    if (timestamp > lastTimestamp) {
+      return lastIndex + Math.floor((timestamp - lastTimestamp) / this._minTimeDifference)
+    }
+    const firstTimestamp = this._dataList[0].timestamp
+    if (timestamp < firstTimestamp) {
+      return Math.floor((timestamp - firstTimestamp) / this._minTimeDifference)
+    }
     return binarySearchNearest(this._dataList, 'timestamp', timestamp)
   }
 
   dataIndexToCoordinate (dataIndex: number): number {
     const dataCount = this._dataList.length
     const deltaFromRight = dataCount + this._lastBarRightSideDiffBarCount - dataIndex
-    // return Math.floor(this._totalBarSpace - (deltaFromRight - 0.5) * this._barSpace) - 0.5
     return Math.floor(this._totalBarSpace - (deltaFromRight - 0.5) * this._barSpace + 0.5)
   }
 
@@ -982,7 +994,7 @@ export default class StoreImp implements Store {
     const kLineData: Nullable<KLineData> = this._dataList[dataIndex]
     const realX = this.dataIndexToCoordinate(realDataIndex)
     const prevCrosshair = { x: this._crosshair.x, y: this._crosshair.y, paneId: this._crosshair.paneId }
-    this._crosshair = { ...cr, realX, kLineData, realDataIndex, dataIndex }
+    this._crosshair = { ...cr, realX, kLineData, realDataIndex, dataIndex, timestamp: this.dataIndexToTimestamp(realDataIndex) ?? undefined }
     if (
       prevCrosshair.x !== cr.x || prevCrosshair.y !== cr.y || prevCrosshair.paneId !== cr.paneId
     ) {

diff --git a/src/common/Crosshair.ts b/src/common/Crosshair.ts
@@ -18,6 +18,7 @@ import type { KLineData } from './Data'
 export default interface Crosshair extends Partial<Coordinate> {
   paneId?: string
   realX?: number
+  timestamp?: number
   kLineData?: KLineData
   dataIndex?: number
   realDataIndex?: number

diff --git a/src/component/Overlay.ts b/src/component/Overlay.ts
@@ -299,7 +299,7 @@ export default class OverlayImp implements Overlay {
   needDefaultYAxisFigure = false
   mode = OverlayMode.Normal
   modeSensitivity = 8
-  points: Array<Partial<Point>> = []
+  points: Array<Partial<Omit<Point, 'dataIndex'>>> = []
   extendData: unknown = null
   styles: Nullable<DeepPartial<OverlayStyle>> = null
   createPointFigures: Nullable<OverlayCreateFiguresCallback> = null
@@ -447,10 +447,7 @@ export default class OverlayImp implements Overlay {
   }
 
   eventPressedPointMove (point: Partial<Point>, pointIndex: number): void {
-    if (isNumber(point.dataIndex)) {
-      this.points[pointIndex].dataIndex = point.dataIndex
-      this.points[pointIndex].timestamp = point.timestamp
-    }
+    this.points[pointIndex].timestamp = point.timestamp
     if (isNumber(point.value)) {
       this.points[pointIndex].value = point.value
     }

diff --git a/src/view/CrosshairVerticalLabelView.ts b/src/view/CrosshairVerticalLabelView.ts
@@ -29,16 +29,16 @@ import type { TextAttrs } from '../extension/figure/text'
 
 export default class CrosshairVerticalLabelView extends CrosshairHorizontalLabelView<XAxis> {
   override compare (crosshair: Crosshair): boolean {
-    return isValid(crosshair.kLineData) && crosshair.dataIndex === crosshair.realDataIndex
+    return isValid(crosshair.timestamp)
   }
 
   override getDirectionStyles (styles: CrosshairStyle): CrosshairDirectionStyle {
     return styles.vertical
   }
 
   override getText (crosshair: Crosshair, chartStore: ChartStore): string {
-    const timestamp = crosshair.kLineData?.timestamp
-    return chartStore.getCustomApi().formatDate(timestamp!, 'YYYY-MM-DD HH:mm', FormatDateType.Crosshair)
+    const timestamp = crosshair.timestamp!
+    return chartStore.getCustomApi().formatDate(timestamp, 'YYYY-MM-DD HH:mm', FormatDateType.Crosshair)
   }
 
   override getTextAttrs (text: string, textWidth: number, crosshair: Crosshair, bounding: Bounding, _axis: Axis, styles: StateTextStyle): TextAttrs {

diff --git a/src/view/OverlayView.ts b/src/view/OverlayView.ts
@@ -296,8 +296,8 @@ export default class OverlayView<C extends Axis = YAxis> extends View<C> {
       const xAxis = chart.getXAxisPane().getAxisComponent()
       const dataIndex = xAxis.convertFromPixel(coordinate.x)
       const timestamp = chartStore.dataIndexToTimestamp(dataIndex) ?? undefined
-      point.dataIndex = dataIndex
       point.timestamp = timestamp
+      point.dataIndex = dataIndex
     }
     if (this.coordinateToPointValueFlag()) {
       const yAxis = pane.getAxisComponent()
@@ -397,7 +397,7 @@ export default class OverlayView<C extends Axis = YAxis> extends View<C> {
     const yAxis = pane.getAxisComponent() as unknown as Nullable<YAxis>
     const xAxis = chart.getXAxisPane().getAxisComponent()
     const coordinates = points.map(point => {
-      let dataIndex = point.dataIndex
+      let dataIndex: Nullable<number> = null
       if (isNumber(point.timestamp)) {
         dataIndex = chartStore.timestampToDataIndex(point.timestamp)
       }