fix: fix add data overlay in the wrong position when point time does …

…not exist. #516
klinecharts · Mar 17, 2024 · 61954b8 · 61954b8
1 parent debdab6
commit 61954b8
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 3 deletions.
diff --git a/src/store/ChartStore.ts b/src/store/ChartStore.ts
@@ -225,8 +225,9 @@ export default class ChartStore {
   async addData (data: KLineData | KLineData[], type?: LoadDataType, more?: boolean): Promise<void> {
     let success = false
     let adjustFlag = false
-
+    let dataLengthChange = 0
     if (isArray<KLineData>(data)) {
+      dataLengthChange = data.length
       switch (type) {
         case LoadDataType.Init: {
           this.clear()
@@ -239,13 +240,13 @@ export default class ChartStore {
         case LoadDataType.Backward: {
           this._dataList = this._dataList.concat(data)
           this._backwardMore = more ?? false
-          adjustFlag = data.length > 0
+          adjustFlag = dataLengthChange > 0
           break
         }
         case LoadDataType.Forward: {
           this._dataList = data.concat(this._dataList)
           this._forwardMore = more ?? false
-          adjustFlag = data.length > 0
+          adjustFlag = dataLengthChange > 0
         }
       }
       this._loading = false
@@ -261,6 +262,7 @@ export default class ChartStore {
         if (lastBarRightSideDiffBarCount < 0) {
           this._timeScaleStore.setLastBarRightSideDiffBarCount(--lastBarRightSideDiffBarCount)
         }
+        dataLengthChange = 1
         success = true
         adjustFlag = true
       } else if (timestamp === lastDataTimestamp) {
@@ -271,6 +273,7 @@ export default class ChartStore {
     }
     if (success) {
       try {
+        this._overlayStore.updatePointPosition(dataLengthChange, type)
         if (adjustFlag) {
           this._timeScaleStore.adjustVisibleRange()
           this._tooltipStore.recalculateCrosshair(true)

diff --git a/src/store/OverlayStore.ts b/src/store/OverlayStore.ts
@@ -17,6 +17,7 @@ import { UpdateLevel } from '../common/Updater'
 import { type MouseTouchEvent } from '../common/SyntheticEvent'
 import { isFunction, isValid, isString, isBoolean, isNumber, isArray } from '../common/utils/typeChecks'
 import { createId } from '../common/utils/id'
+import { LoadDataType } from '../common/LoadDataCallback'
 
 import { type OverlayCreate, type OverlayRemove } from '../component/Overlay'
 import type OverlayImp from '../component/Overlay'
@@ -420,6 +421,26 @@ export default class OverlayStore {
     return this._pressedInstanceInfo
   }
 
+  updatePointPosition (dataChangeLength: number, type?: LoadDataType): void {
+    if (dataChangeLength > 0) {
+      const dataList = this._chartStore.getDataList()
+      this._instances.forEach(overlays => {
+        overlays.forEach(o => {
+          const points = o.points
+          points.forEach(point => {
+            if (!isValid(point.timestamp) && isValid(point.dataIndex)) {
+              if (type === LoadDataType.Forward) {
+                point.dataIndex = point.dataIndex + dataChangeLength
+              }
+              const data = dataList[point.dataIndex]
+              point.timestamp = data?.timestamp
+            }
+          })
+        })
+      })
+    }
+  }
+
   setHoverInstanceInfo (info: EventOverlayInfo, event: MouseTouchEvent): void {
     const { instance, figureType, figureKey, figureIndex } = this._hoverInstanceInfo
     if (