+
-
diff --git a/docs/@components/Logo.vue b/docs/@components/Logo.vue
new file mode 100644
index 000000000..04b729ff8
--- /dev/null
+++ b/docs/@components/Logo.vue
@@ -0,0 +1,21 @@
+
+
+
+
+
+
diff --git a/docs/@components/NavbarTitle.vue b/docs/@components/NavbarTitle.vue
new file mode 100644
index 000000000..324b31324
--- /dev/null
+++ b/docs/@components/NavbarTitle.vue
@@ -0,0 +1,124 @@
+
+
+
+
+
+
+
diff --git a/docs/@components/Particle.vue b/docs/@components/Particle.vue
new file mode 100644
index 000000000..f544a895a
--- /dev/null
+++ b/docs/@components/Particle.vue
@@ -0,0 +1,121 @@
+
+
@@ -95,4 +109,12 @@ provide('toggle-appearance', async ({ clientX: x, clientY: y }) => {
.VPSwitchAppearance .check {
transform: none !important;
}
+
+.page-loading {
+ position: fixed!important;
+ width: 100vw!important;
+ height: 100vh!important;
+ color: var(--vp-c-text-1)!important;
+ background-color: var(--vp-c-bg)!important;
+}
\ No newline at end of file
diff --git a/docs/@views/NotFound.vue b/docs/@views/NotFound.vue
index e3ee04dec..23acaa8db 100644
--- a/docs/@views/NotFound.vue
+++ b/docs/@views/NotFound.vue
@@ -3,19 +3,29 @@ import { onMounted, ref } from 'vue'
import { withBase, useData } from 'vitepress'
import i18n from '../@i18n'
+import Logo from '../@components/Logo.vue'
+import Particle from '../@components/Particle.vue'
const { lang } = useData()
const root = ref('/')
onMounted(() => {
root.value = lang.value === 'zh-CN' ? '/' : `/${lang.value}/`
})
+
+const particle = ref(null)
+
+function showParticle() {
+ if (particle.value && particle.value.start) {
+ particle.value.start()
+ }
+}
): void {
+ this._chartStore.setBarSpaceLimit(limit)
+ }
+
+ getBarSpaceLimit (): BarSpaceLimit {
+ return this._chartStore.getBarSpaceLimit()
+ }
+
getVisibleRange (): VisibleRange {
return this._chartStore.getVisibleRange()
}
@@ -694,8 +702,8 @@ export default class ChartImp implements Chart {
this._chartStore.resetData()
}
- getDataList (): KLineData[] {
- return this._chartStore.getDataList()
+ getDataList (mutateToCandleType = false): KLineData[] {
+ return this._chartStore.getDataList(mutateToCandleType)
}
setDataLoader (dataLoader: DataLoader): void {
@@ -973,8 +981,8 @@ export default class ChartImp implements Chart {
this._chartStore.setZoomAnchor(anchor)
}
- zoomAnchor (): ZoomAnchor {
- return this._chartStore.zoomAnchor()
+ getZoomAnchor (): ZoomAnchor {
+ return this._chartStore.getZoomAnchor()
}
setScrollEnabled (enabled: boolean): void {
@@ -1030,12 +1038,12 @@ export default class ChartImp implements Chart {
animation.doFrame(frameTime => {
const progressBarSpace = difSpace * (frameTime / duration)
const scale = (progressBarSpace - prevProgressBarSpace) / this._chartStore.getBarSpace().bar * SCALE_MULTIPLIER
- this._chartStore.zoom(scale, coordinate)
+ this._chartStore.zoom(scale, coordinate ?? null, 'main')
prevProgressBarSpace = progressBarSpace
})
animation.start()
} else {
- this._chartStore.zoom(difSpace / barSpace * SCALE_MULTIPLIER, coordinate)
+ this._chartStore.zoom(difSpace / barSpace * SCALE_MULTIPLIER, coordinate ?? null, 'main')
}
}
@@ -1111,11 +1119,14 @@ export default class ChartImp implements Chart {
return isArray(coordinates) ? points : (points[0] ?? {})
}
- executeAction (type: ActionType, data: Crosshair): void {
+ executeAction (type: ActionType, data: Nullable): void {
switch (type) {
case 'onCrosshairChange': {
- const crosshair: Crosshair = { ...data }
- crosshair.paneId ??= PaneIdConstants.CANDLE
+ let crosshair: Nullable = null
+ if (isValid(data)) {
+ crosshair = { ...data }
+ crosshair.paneId ??= PaneIdConstants.CANDLE
+ }
this._chartStore.setCrosshair(crosshair, { notExecuteAction: true })
break
}
diff --git a/src/Event.ts b/src/Event.ts
index 1cb484d07..1e3ad9827 100644
--- a/src/Event.ts
+++ b/src/Event.ts
@@ -72,11 +72,11 @@ export default class Event implements EventHandler {
if (event.shiftKey) {
switch (event.code) {
case 'Equal': {
- this._chart.getChartStore().zoom(0.5, this._chart.getChartStore().zoomAnchor().main === 'last_bar' ? this.lastDataCoordinate() : undefined)
+ this._chart.getChartStore().zoom(0.5, null, 'main')
break
}
case 'Minus': {
- this._chart.getChartStore().zoom(-0.5, this._chart.getChartStore().zoomAnchor().main === 'last_bar' ? this.lastDataCoordinate() : undefined)
+ this._chart.getChartStore().zoom(-0.5, null, 'main')
break
}
case 'ArrowLeft': {
@@ -108,11 +108,6 @@ export default class Event implements EventHandler {
container.addEventListener('keydown', this._boundKeyBoardDownEvent)
}
- private lastDataCoordinate (): Partial {
- const store = this._chart.getChartStore()
- return { x: store.dataIndexToCoordinate(store.getDataList().length - 1) }
- }
-
pinchStartEvent (): boolean {
this._touchZoomed = true
this._pinchScale = 1
@@ -125,7 +120,7 @@ export default class Event implements EventHandler {
const event = this._makeWidgetEvent(e, widget)
const zoomScale = (scale - this._pinchScale) * 5
this._pinchScale = scale
- this._chart.getChartStore().zoom(zoomScale, this._chart.getChartStore().zoomAnchor().main === 'last_bar' ? this.lastDataCoordinate() : { x: event.x, y: event.y })
+ this._chart.getChartStore().zoom(zoomScale, { x: event.x, y: event.y }, 'main')
return true
}
return false
@@ -143,7 +138,7 @@ export default class Event implements EventHandler {
const event = this._makeWidgetEvent(e, widget)
const name = widget?.getName()
if (name === WidgetNameConstants.MAIN) {
- this._chart.getChartStore().zoom(scale, this._chart.getChartStore().zoomAnchor().main === 'last_bar' ? this.lastDataCoordinate() : { x: event.x, y: event.y })
+ this._chart.getChartStore().zoom(scale, { x: event.x, y: event.y }, 'main')
return true
}
return false
@@ -160,14 +155,19 @@ export default class Event implements EventHandler {
return widget.dispatchEvent('mouseDownEvent', event)
}
case WidgetNameConstants.MAIN: {
- const yAxis = (pane as DrawPane).getAxisComponent()
- if (!yAxis.getAutoCalcTickFlag()) {
- const range = yAxis.getRange()
- this._prevYAxisRange = { ...range }
+ // Dispatch event first to allow overlays (e.g., continuous drawing) to consume it
+ const consumed = widget.dispatchEvent('mouseDownEvent', event)
+ // Only start scrolling if the event was not consumed by an overlay
+ if (!consumed) {
+ const yAxis = (pane as DrawPane).getAxisComponent()
+ if (!yAxis.getAutoCalcTickFlag()) {
+ const range = yAxis.getRange()
+ this._prevYAxisRange = { ...range }
+ }
+ this._startScrollCoordinate = { x: event.x, y: event.y }
+ this._chart.getChartStore().startScroll()
}
- this._startScrollCoordinate = { x: event.x, y: event.y }
- this._chart.getChartStore().startScroll()
- return widget.dispatchEvent('mouseDownEvent', event)
+ return consumed
}
case WidgetNameConstants.X_AXIS: {
return this._processXAxisScrollStartEvent(widget, event)
@@ -239,6 +239,9 @@ export default class Event implements EventHandler {
const consumed = widget.dispatchEvent('pressedMouseMoveEvent', event)
if (!consumed) {
this._processMainScrollingEvent(widget as Widget>, event)
+ } else {
+ // Explicitly update overlay when event was consumed (e.g., continuous drawing)
+ this._chart.updatePane(UpdateLevel.Overlay)
}
if (!consumed || widget.getForceCursor() === 'pointer') {
crosshair = { x: event.x, y: event.y, paneId: pane?.getId() }
@@ -407,17 +410,18 @@ export default class Event implements EventHandler {
const { pane, widget } = this._findWidgetByEvent(e)
if (widget !== null) {
const event = this._makeWidgetEvent(e, widget)
- event.preventDefault?.()
const name = widget.getName()
const chartStore = this._chart.getChartStore()
switch (name) {
case WidgetNameConstants.MAIN: {
if (widget.dispatchEvent('pressedMouseMoveEvent', event)) {
+ event.preventDefault?.()
chartStore.setCrosshair(undefined, { notInvalidate: true })
this._chart.updatePane(UpdateLevel.Overlay)
return true
}
if (this._touchCoordinate !== null) {
+ event.preventDefault?.()
chartStore.setCrosshair({ x: event.x, y: event.y, paneId: pane?.getId() })
} else {
this._processMainScrollingEvent(widget as Widget>, event)
@@ -425,6 +429,7 @@ export default class Event implements EventHandler {
return true
}
case WidgetNameConstants.X_AXIS: {
+ event.preventDefault?.()
return this._processXAxisScrollingEvent(widget as Widget>, event)
}
case WidgetNameConstants.Y_AXIS: {
@@ -536,6 +541,7 @@ export default class Event implements EventHandler {
if (this._startScrollCoordinate !== null) {
const yAxis = widget.getPane().getAxisComponent()
if (this._prevYAxisRange !== null && !yAxis.getAutoCalcTickFlag() && yAxis.scrollZoomEnabled) {
+ event.preventDefault?.()
const { from, to, range } = this._prevYAxisRange
let distance = 0
if (yAxis.reverse) {
@@ -588,7 +594,7 @@ export default class Event implements EventHandler {
if (Number.isFinite(scale)) {
const zoomScale = (scale - this._xAxisScale) * 10
this._xAxisScale = scale
- this._chart.getChartStore().zoom(zoomScale, this._chart.getChartStore().zoomAnchor().xAxis === 'last_bar' ? this.lastDataCoordinate() : (this._xAxisStartScaleCoordinate ?? undefined))
+ this._chart.getChartStore().zoom(zoomScale, this._xAxisStartScaleCoordinate, 'xAxis')
}
}
} else {
@@ -613,6 +619,7 @@ export default class Event implements EventHandler {
if (!consumed) {
const yAxis = widget.getPane().getAxisComponent()
if (this._prevYAxisRange !== null && yAxis.scrollZoomEnabled && this._yAxisStartScaleDistance !== 0) {
+ event.preventDefault?.()
const { from, to, range } = this._prevYAxisRange
const scale = event.pageY / this._yAxisStartScaleDistance
const newRange = range * scale
diff --git a/src/Options.ts b/src/Options.ts
index a64712e17..84b364eff 100644
--- a/src/Options.ts
+++ b/src/Options.ts
@@ -85,9 +85,16 @@ export interface ThousandsSeparator {
format: (value: string | number) => string
}
+export type ZoomAnchorType = 'cursor' | 'last_bar'
+
export interface ZoomAnchor {
- main: 'cursor_point' | 'last_bar'
- xAxis: 'cursor_point' | 'last_bar'
+ main: ZoomAnchorType
+ xAxis: ZoomAnchorType
+}
+
+export interface BarSpaceLimit {
+ min: number
+ max: number
}
export interface Options {
@@ -99,4 +106,5 @@ export interface Options {
decimalFold?: Partial
layout?: LayoutChild[]
zoomAnchor?: Partial
+ barSpaceLimit?: Partial
}
diff --git a/src/Store.ts b/src/Store.ts
index bbd5d4a50..a34a65fea 100644
--- a/src/Store.ts
+++ b/src/Store.ts
@@ -20,7 +20,7 @@ import type { KLineData, VisibleRangeData } from './common/Data'
import type VisibleRange from './common/VisibleRange'
import type Coordinate from './common/Coordinate'
import { getDefaultVisibleRange } from './common/VisibleRange'
-import TaskScheduler, { generateTaskId } from './common/TaskScheduler'
+import TaskScheduler from './common/TaskScheduler'
import type Crosshair from './common/Crosshair'
import type BarSpace from './common/BarSpace'
import type { Period } from './common/Period'
@@ -37,7 +37,7 @@ import { logWarn } from './common/utils/logger'
import { UpdateLevel } from './common/Updater'
import type { DataLoader, DataLoaderGetBarsParams, DataLoadMore, DataLoadType } from './common/DataLoader'
-import type { Options, Formatter, ThousandsSeparator, DecimalFold, FormatDateType, FormatDateParams, FormatBigNumber, FormatExtendText, FormatExtendTextParams, ZoomAnchor } from './Options'
+import type { Options, Formatter, ThousandsSeparator, DecimalFold, BarSpaceLimit, FormatDateType, FormatDateParams, FormatBigNumber, FormatExtendText, FormatExtendTextParams, ZoomAnchor, ZoomAnchorType } from './Options'
import type { IndicatorOverride, IndicatorCreate, IndicatorFilter } from './component/Indicator'
import type IndicatorImp from './component/Indicator'
@@ -53,7 +53,7 @@ import { PaneIdConstants } from './pane/types'
import type Chart from './Chart'
-const BarSpaceLimitConstants = {
+const DEFAULT_BAR_SPACE_LIMIT = {
MIN: 1,
MAX: 50
}
@@ -105,7 +105,7 @@ export interface Store {
getSymbol: () => Nullable
setPeriod: (period: Period) => void
getPeriod: () => Nullable
- getDataList: () => KLineData[]
+ getDataList: (mutateToCandleType?: boolean) => KLineData[]
setOffsetRightDistance: (distance: number) => void
getOffsetRightDistance: () => number
setMaxOffsetLeftDistance: (distance: number) => void
@@ -114,6 +114,8 @@ export interface Store {
setRightMinVisibleBarCount: (barCount: number) => void
setBarSpace: (space: number) => void
getBarSpace: () => BarSpace
+ setBarSpaceLimit: (limit: Partial) => void
+ getBarSpaceLimit: () => BarSpaceLimit
getVisibleRange: () => VisibleRange
setDataLoader: (dataLoader: DataLoader) => void
overrideIndicator: (override: IndicatorCreate) => boolean
@@ -123,7 +125,7 @@ export interface Store {
setZoomEnabled: (enabled: boolean) => void
isZoomEnabled: () => boolean
setZoomAnchor: (behavior: ZoomAnchor) => void
- zoomAnchor: () => ZoomAnchor
+ getZoomAnchor: () => ZoomAnchor
setScrollEnabled: (enabled: boolean) => void
isScrollEnabled: () => boolean
resetData: () => void
@@ -228,8 +230,8 @@ export default class StoreImp implements Store {
* Zoom anchor point flag
*/
private readonly _zoomAnchor: ZoomAnchor = {
- main: 'cursor_point',
- xAxis: 'cursor_point'
+ main: 'cursor',
+ xAxis: 'cursor'
}
/**
@@ -247,6 +249,14 @@ export default class StoreImp implements Store {
*/
private _barSpace = DEFAULT_BAR_SPACE
+ /**
+ * Bar space limit
+ */
+ private readonly _barSpaceLimit: BarSpaceLimit = {
+ min: DEFAULT_BAR_SPACE_LIMIT.MIN,
+ max: DEFAULT_BAR_SPACE_LIMIT.MAX
+ }
+
/**
* The space of the draw bar
*/
@@ -318,7 +328,7 @@ export default class StoreImp implements Store {
/**
* Task scheduler
*/
- private readonly _taskScheduler = new TaskScheduler()
+ private readonly _taskScheduler: TaskScheduler
/**
* Overlay
@@ -369,7 +379,7 @@ export default class StoreImp implements Store {
this._chart = chart
this._calcOptimalBarSpace()
this._lastBarRightSideDiffBarCount = this._offsetRightDistance / this._barSpace
- const { styles, locale, timezone, formatter, thousandsSeparator, decimalFold, zoomAnchor } = options ?? {}
+ const { styles, locale, timezone, formatter, thousandsSeparator, decimalFold, barSpaceLimit, zoomAnchor } = options ?? {}
if (isValid(styles)) {
this.setStyles(styles)
}
@@ -389,6 +399,16 @@ export default class StoreImp implements Store {
if (isValid(zoomAnchor)) {
this.setZoomAnchor(zoomAnchor)
}
+ if (isValid(barSpaceLimit)) {
+ this.setBarSpaceLimit(barSpaceLimit)
+ }
+ this._taskScheduler = new TaskScheduler(() => {
+ this._chart.layout({
+ measureWidth: true,
+ update: true,
+ buildYAxisTick: true
+ })
+ })
}
setStyles (value: string | DeepPartial): void {
@@ -512,18 +532,94 @@ export default class StoreImp implements Store {
return this._period
}
- getDataList (): KLineData[] {
- return this._dataList
+ getDataList (mutateToCandleType = false): KLineData[] {
+ if (!mutateToCandleType || this._styles.candle.type !== 'heikin_ashi') {
+ return this._dataList
+ }
+
+ let prevHaBar: Nullable = null
+ return this._dataList.map(value => {
+ const data = this.ohlcvToHeikinAshi(value, prevHaBar)
+ prevHaBar = data
+ return data
+ })
}
- getVisibleRangeDataList (): VisibleRangeData[] {
- return this._visibleRangeDataList
+ getVisibleRangeDataList (mutateToCandleType = false): VisibleRangeData[] {
+ if (!mutateToCandleType || this._styles.candle.type !== 'heikin_ashi') {
+ return this._visibleRangeDataList
+ }
+
+ const result: VisibleRangeData[] = []
+ let prevHaBar: Nullable = null
+ const list = this._visibleRangeDataList
+ const len = list.length
+
+ for (let i = 0; i < len; i++) {
+ const curOrig: Nullable = list[i].data.current ?? null
+ if (curOrig === null) {
+ continue
+ }
+ const curHa = this.ohlcvToHeikinAshi(curOrig, prevHaBar)
+ const prevHa = prevHaBar
+
+ let nextHa: Nullable = null
+ if (i + 1 < len) {
+ const nextOrig: Nullable = list[i + 1].data.current ?? null
+ nextHa = nextOrig === null ? null : this.ohlcvToHeikinAshi(nextOrig, curHa)
+ } else {
+ nextHa = null
+ }
+
+ result.push({
+ dataIndex: list[i].dataIndex,
+ x: list[i].x,
+ data: {
+ prev: prevHa,
+ current: curHa,
+ next: nextHa
+ }
+ })
+
+ prevHaBar = curHa
+ }
+
+ return result
}
getVisibleRangeHighLowPrice (): Array<{ price: number; x: number }> {
return this._visibleRangeHighLowPrice
}
+ private ohlcvToHeikinAshi (currentBar: KLineData, prevHaBar: Nullable): KLineData {
+ if (prevHaBar === null) {
+ const firstHaBar: KLineData = {
+ timestamp: currentBar.timestamp,
+ open: (currentBar.open + currentBar.close) / 2, // Some methods use currentBar.o, but averaging is more common
+ high: currentBar.high,
+ low: currentBar.low,
+ close: (currentBar.open + currentBar.high + currentBar.low + currentBar.close) / 4
+ }
+
+ return firstHaBar
+ }
+
+ const haClose = (currentBar.open + currentBar.high + currentBar.low + currentBar.close) / 4
+ const haOpen = (prevHaBar.open + prevHaBar.close) / 2
+ const haHigh = Math.max(currentBar.high, haOpen, haClose)
+ const haLow = Math.min(currentBar.low, haOpen, haClose)
+
+ const newHaBar: KLineData = {
+ timestamp: currentBar.timestamp,
+ open: haOpen,
+ high: haHigh,
+ low: haLow,
+ close: haClose
+ }
+
+ return newHaBar
+ }
+
private _addData (
data: KLineData | KLineData[],
type: DataLoadType,
@@ -590,14 +686,13 @@ export default class StoreImp implements Store {
adjustFlag = true
}
}
- if (success) {
- if (adjustFlag) {
- this._adjustVisibleRange()
- this.setCrosshair(this._crosshair, { notInvalidate: true })
- const filterIndicators = this.getIndicatorsByFilter({})
- filterIndicators.forEach(indicator => {
- this._addIndicatorCalcTask(indicator, type)
- })
+ if (success && adjustFlag) {
+ this._adjustVisibleRange()
+ this.setCrosshair(this._crosshair, { notInvalidate: true })
+ const filterIndicators = this.getIndicatorsByFilter({})
+ if (filterIndicators.length > 0) {
+ this._calcIndicator(filterIndicators)
+ } else {
this._chart.layout({
measureWidth: true,
update: true,
@@ -712,7 +807,7 @@ export default class StoreImp implements Store {
symbol: this._symbol,
period: this._period,
timestamp: null,
- callback: (data: KLineData[], more?: boolean) => {
+ callback: (data: KLineData[], more?: DataLoadMore) => {
this._loading = false
this._addData(data, type, more)
if (type === 'init') {
@@ -768,8 +863,21 @@ export default class StoreImp implements Store {
}
}
+ setBarSpaceLimit (limit: Partial): void {
+ if (isValid(limit.min) && isNumber(limit.min)) {
+ this._barSpaceLimit.min = Math.max(0, limit.min)
+ }
+ if (isValid(limit.max) && isNumber(limit.max)) {
+ this._barSpaceLimit.max = Math.max(this._barSpaceLimit.min, limit.max)
+ }
+ }
+
+ getBarSpaceLimit (): BarSpaceLimit {
+ return { ...this._barSpaceLimit }
+ }
+
setBarSpace (barSpace: number, adjustBeforeFunc?: () => void): void {
- if (barSpace < BarSpaceLimitConstants.MIN || barSpace > BarSpaceLimitConstants.MAX || this._barSpace === barSpace) {
+ if (barSpace < this._barSpaceLimit.min || barSpace > this._barSpaceLimit.max || this._barSpace === barSpace) {
return
}
this._barSpace = barSpace
@@ -1019,13 +1127,154 @@ export default class StoreImp implements Store {
return Math.ceil(this.coordinateToFloatIndex(x)) - 1
}
- zoom (scale: number, coordinate?: Partial): void {
+ /**
+ * Converts a float data index to an interpolated timestamp.
+ * This allows sub-bar precision for smooth freehand drawings.
+ * Supports extrapolation beyond the data range (drawing in the "future").
+ * @param floatIndex - A floating point index (e.g., 42.75)
+ * @returns An interpolated timestamp between two bars
+ */
+ floatIndexToTimestamp (floatIndex: number): Nullable {
+ const length = this._dataList.length
+ if (length === 0) {
+ return null
+ }
+
+ const lastIndex = length - 1
+
+ // Handle float index beyond the last bar (extrapolate into the future)
+ if (floatIndex > lastIndex && length >= 2) {
+ const lastTimestamp = this._dataList[lastIndex].timestamp
+ const secondLastTimestamp = this._dataList[lastIndex - 1].timestamp
+ const barDuration = lastTimestamp - secondLastTimestamp
+ if (barDuration > 0) {
+ const barsBeyondLast = floatIndex - lastIndex
+ return Math.round(lastTimestamp + barsBeyondLast * barDuration)
+ }
+ }
+
+ // Handle float index before the first bar (extrapolate into the past)
+ if (floatIndex < 0 && length >= 2) {
+ const firstTimestamp = this._dataList[0].timestamp
+ const secondTimestamp = this._dataList[1].timestamp
+ const barDuration = secondTimestamp - firstTimestamp
+ if (barDuration > 0) {
+ return Math.round(firstTimestamp + floatIndex * barDuration)
+ }
+ }
+
+ // Normal case: interpolate between two bars within the data range
+ const intIndex = Math.floor(floatIndex)
+ const fraction = floatIndex - intIndex
+
+ // Get timestamp at the integer index
+ const timestampAtInt = this.dataIndexToTimestamp(intIndex)
+
+ // If no fractional part, return the integer timestamp
+ if (fraction === 0 || !isNumber(timestampAtInt)) {
+ return timestampAtInt
+ }
+
+ // Get timestamp at the next index for interpolation
+ const timestampAtNext = this.dataIndexToTimestamp(intIndex + 1)
+
+ if (isNumber(timestampAtNext)) {
+ // Linear interpolation between the two timestamps
+ return Math.round(timestampAtInt + (timestampAtNext - timestampAtInt) * fraction)
+ }
+
+ return timestampAtInt
+ }
+
+ /**
+ * Converts a precise timestamp to a float data index.
+ * This preserves sub-bar precision for smooth freehand drawings across timeframe changes.
+ * Supports extrapolation beyond the data range (drawing in the "future").
+ * @param timestamp - A precise timestamp (possibly between or beyond bars)
+ * @returns A floating point index representing the exact position
+ */
+ timestampToFloatIndex (timestamp: number): number {
+ const length = this._dataList.length
+ if (length === 0) {
+ return 0
+ }
+
+ const firstTimestamp = this._dataList[0].timestamp
+ const lastTimestamp = this._dataList[length - 1].timestamp
+
+ // Handle timestamp beyond the last bar (drawing in the "future")
+ if (timestamp > lastTimestamp && length >= 2) {
+ // Calculate average bar duration from the last two bars
+ const secondLastTimestamp = this._dataList[length - 2].timestamp
+ const barDuration = lastTimestamp - secondLastTimestamp
+ if (barDuration > 0) {
+ const timeBeyondLast = timestamp - lastTimestamp
+ const barsBeyond = timeBeyondLast / barDuration
+ return length - 1 + barsBeyond
+ }
+ }
+
+ // Handle timestamp before the first bar
+ if (timestamp < firstTimestamp && length >= 2) {
+ const secondTimestamp = this._dataList[1].timestamp
+ const barDuration = secondTimestamp - firstTimestamp
+ if (barDuration > 0) {
+ const timeBeforeFirst = firstTimestamp - timestamp
+ const barsBefore = timeBeforeFirst / barDuration
+ return -barsBefore
+ }
+ }
+
+ // Find the floor bar index using binary search
+ // We need the bar where barTimestamp <= timestamp < nextBarTimestamp
+ let left = 0
+ let right = length - 1
+ let floorIndex = 0
+
+ while (left <= right) {
+ const mid = Math.floor((left + right) / 2)
+ const midTimestamp = this._dataList[mid].timestamp
+
+ if (midTimestamp <= timestamp) {
+ floorIndex = mid
+ left = mid + 1
+ } else {
+ right = mid - 1
+ }
+ }
+
+ // Get the floor bar and the next bar for interpolation
+ const dataAtFloor = this._dataList[floorIndex]
+ const dataAtNext = floorIndex + 1 < length ? this._dataList[floorIndex + 1] : null
+
+ if (isValid(dataAtFloor) && isValid(dataAtNext)) {
+ const timestampAtFloor = dataAtFloor.timestamp
+ const timestampAtNext = dataAtNext.timestamp
+
+ // Calculate fractional position between the two bars
+ if (timestamp >= timestampAtFloor && timestampAtNext > timestampAtFloor) {
+ const fraction = (timestamp - timestampAtFloor) / (timestampAtNext - timestampAtFloor)
+ return floorIndex + Math.min(fraction, 1) // Clamp to max 1
+ }
+ }
+
+ return floorIndex
+ }
+
+ zoom (scale: number, coordinate: Nullable>, position: 'main' | 'xAxis'): void {
if (!this._zoomEnabled) {
return
}
- let zoomCoordinate: Nullable> = coordinate ?? null
- if (!isNumber(zoomCoordinate?.x)) {
- zoomCoordinate = { x: this._crosshair.x ?? this._totalBarSpace / 2 }
+ const zoomCoordinate: Partial = coordinate ?? { x: this._crosshair.x ?? this._totalBarSpace / 2 }
+
+ if (position === 'xAxis') {
+ if (this._zoomAnchor.xAxis === 'last_bar') {
+ zoomCoordinate.x = this.dataIndexToCoordinate(this._dataList.length - 1)
+ }
+ } else {
+ if (this._zoomAnchor.main === 'last_bar') {
+ zoomCoordinate.x = this.dataIndexToCoordinate(this._dataList.length - 1)
+ }
}
const x = zoomCoordinate.x!
const floatIndex = this.coordinateToFloatIndex(x)
@@ -1048,16 +1297,21 @@ export default class StoreImp implements Store {
return this._zoomEnabled
}
- setZoomAnchor (anchor: Partial): void {
- if (isValid(anchor.main) && isString(anchor.main)) {
- this._zoomAnchor.main = anchor.main
- }
- if (isValid(anchor.xAxis) && isString(anchor.xAxis)) {
- this._zoomAnchor.xAxis = anchor.xAxis
+ setZoomAnchor (anchor: ZoomAnchorType | Partial): void {
+ if (isString(anchor)) {
+ this._zoomAnchor.main = anchor
+ this._zoomAnchor.xAxis = anchor
+ } else {
+ if (isString(anchor.main)) {
+ this._zoomAnchor.main = anchor.main
+ }
+ if (isString(anchor.xAxis)) {
+ this._zoomAnchor.xAxis = anchor.xAxis
+ }
}
}
- zoomAnchor (): ZoomAnchor {
+ getZoomAnchor (): ZoomAnchor {
return { ...this._zoomAnchor }
}
@@ -1070,7 +1324,7 @@ export default class StoreImp implements Store {
}
setCrosshair (
- crosshair?: Crosshair,
+ crosshair?: Nullable,
options?: { notInvalidate?: boolean, notExecuteAction?: boolean, forceInvalidate?: boolean }
): void {
const { notInvalidate, notExecuteAction, forceInvalidate } = options ?? {}
@@ -1149,38 +1403,16 @@ export default class StoreImp implements Store {
}
}
- private _addIndicatorCalcTask (indicator: IndicatorImp, dataLoadType: DataLoadType): void {
- indicator.onDataStateChange?.({
- state: 'loading',
- type: dataLoadType,
- indicator
- })
- void this._taskScheduler.add({
- id: generateTaskId(indicator.id),
- handler: async () => await indicator.calcImp(this._dataList).then(result => result)
- }).then(result => {
- if (result) {
- this._chart.layout({
- measureWidth: true,
- update: true,
- buildYAxisTick: true,
- cacheYAxisWidth: dataLoadType !== 'init'
- })
- indicator.onDataStateChange?.({
- state: 'ready',
- type: dataLoadType,
- indicator
- })
- }
- }).catch((e: unknown) => {
- if (e !== 'canceled') {
- indicator.onDataStateChange?.({
- state: 'error',
- type: dataLoadType,
- indicator
- })
- }
- })
+ private _calcIndicator (data: IndicatorImp | IndicatorImp[]): void {
+ let indicators: IndicatorImp[] = []
+ indicators = indicators.concat(data)
+ if (indicators.length > 0) {
+ const tasks: Record> = {}
+ indicators.forEach(indicator => {
+ tasks[indicator.id] = indicator.calcImp(this._dataList)
+ })
+ this._taskScheduler.add(tasks)
+ }
}
addIndicator (create: PickRequired, paneId: string, isStack: boolean): boolean {
@@ -1203,7 +1435,7 @@ export default class StoreImp implements Store {
paneIndicators.push(indicator)
this._indicators.set(paneId, paneIndicators)
this._sortIndicators(paneId)
- this._addIndicatorCalcTask(indicator, 'init')
+ this._calcIndicator(indicator)
return true
}
@@ -1237,7 +1469,6 @@ export default class StoreImp implements Store {
const paneIndicators = this.getIndicatorsByPaneId(indicator.paneId)
const index = paneIndicators.findIndex(ins => ins.id === indicator.id)
if (index > -1) {
- this._taskScheduler.remove(generateTaskId(indicator.id))
paneIndicators.splice(index, 1)
removed = true
}
@@ -1295,7 +1526,7 @@ export default class StoreImp implements Store {
sortFlag = true
}
if (calc) {
- this._addIndicatorCalcTask(indicator, 'update')
+ this._calcIndicator(indicator)
} else {
if (draw) {
updateFlag = true
@@ -1598,7 +1829,11 @@ export default class StoreImp implements Store {
}
isOverlayDrawing (): boolean {
- return this._progressOverlayInfo?.overlay.isDrawing() ?? false
+ const info = this._progressOverlayInfo
+ if (info !== null) {
+ return info.overlay.isDrawing()
+ }
+ return false
}
private _clearLastPriceMarkExtendTextUpdateTimer (): void {
diff --git a/src/common/DataLoader.ts b/src/common/DataLoader.ts
index feef65371..28968c200 100644
--- a/src/common/DataLoader.ts
+++ b/src/common/DataLoader.ts
@@ -20,8 +20,8 @@ import type { Period } from './Period'
export type DataLoadType = 'init' | 'forward' | 'backward' | 'update'
export type DataLoadMore = boolean | {
- backward: boolean
- forward: boolean
+ backward?: boolean
+ forward?: boolean
}
export interface DataLoaderGetBarsParams {
diff --git a/src/common/Styles.ts b/src/common/Styles.ts
index 82a341aa2..8b045c6b6 100644
--- a/src/common/Styles.ts
+++ b/src/common/Styles.ts
@@ -237,7 +237,7 @@ export interface CandleTooltipStyle extends TooltipStyle {
rect: CandleTooltipRectStyle
}
-export type CandleType = 'candle_solid' | 'candle_stroke' | 'candle_up_stroke' | 'candle_down_stroke' | 'ohlc' | 'area'
+export type CandleType = 'candle_solid' | 'candle_stroke' | 'candle_up_stroke' | 'candle_down_stroke' | 'ohlc' | 'area' | 'heikin_ashi'
export type CandleColorCompareRule = 'current_open' | 'previous_close'
diff --git a/src/common/TaskScheduler.ts b/src/common/TaskScheduler.ts
index 3a00ae0e5..7d920d37b 100644
--- a/src/common/TaskScheduler.ts
+++ b/src/common/TaskScheduler.ts
@@ -12,101 +12,53 @@
* limitations under the License.
*/
+import type Nullable from './Nullable'
import { isValid } from './utils/typeChecks'
-export function generateTaskId (...params: string[]): string {
- return params.join('_')
-}
-
-interface Task {
- id: string
- handler: () => Promise
-}
-
-type TaskRun = () => void
-
-export type TaskRejectReason = 'canceled' | 'failed'
-
-interface TaskWrapper {
- run: TaskRun
- reject: (reason?: TaskRejectReason) => void
-}
-
-const DEFAULT_TASK_LIMIT = 5
+type TaskFinishedCallback = () => void
export default class TaskScheduler {
- private readonly _limit: number
- private _running = 0
- private _queue: TaskRun[] = []
- private readonly _taskMap = new Map()
+ private _holdingTasks: Nullable>> = null
- constructor (limit?: number) {
- this._limit = limit ?? DEFAULT_TASK_LIMIT
- }
+ private _running = false
- async add (task: Task): Promise {
- return await new Promise((resolve, reject) => {
- const { id, handler } = task
- const run: TaskRun = () => {
- this._running++
- handler().then(
- result => {
- resolve(result)
- }
- ).catch(
- () => {
- // eslint-disable-next-line @typescript-eslint/prefer-promise-reject-errors, prefer-promise-reject-errors -- ignore
- reject('failed')
- }
- ).finally(() => {
- this._running--
- this._taskMap.delete(id)
- this._next()
- })
- }
+ private readonly _callback: Nullable
- const oldTaskWrapper = this._taskMap.get(id)
- if (isValid(oldTaskWrapper)) {
- oldTaskWrapper.reject('canceled')
+ constructor (callback: TaskFinishedCallback) {
+ this._callback = callback
+ }
- const index = this._queue.indexOf(oldTaskWrapper.run)
- if (index > -1) {
- this._queue.splice(index, 1)
+ add (tasks: Record>): void {
+ if (!this._running) {
+ void this._runTask(tasks)
+ } else {
+ if (isValid(this._holdingTasks)) {
+ this._holdingTasks = {
+ ...this._holdingTasks,
+ ...tasks
}
+ } else {
+ this._holdingTasks = tasks
}
-
- this._taskMap.set(id, { run, reject })
- this._queue.push(run)
- this._next()
- })
- }
-
- private _next (): void {
- while (this._running < this._limit && this._queue.length > 0) {
- const fn = this._queue.shift()
- fn?.()
}
}
- remove (id: string): void {
- const taskWrapper = this._taskMap.get(id)
- if (isValid(taskWrapper)) {
- this._taskMap.delete(id)
-
- const index = this._queue.indexOf(taskWrapper.run)
- if (index > -1) {
- this._queue.splice(index, 1)
+ private async _runTask (tasks: Record>): Promise {
+ this._running = true
+ try {
+ await Promise.all(Object.values(tasks))
+ } finally {
+ this._running = false
+ this._callback?.()
+ if (isValid(this._holdingTasks)) {
+ const next = this._holdingTasks
+ void this._runTask(next)
+ this._holdingTasks = null
}
-
- taskWrapper.reject('canceled')
}
}
clear (): void {
- for (const [, { reject }] of this._taskMap) {
- reject('canceled')
- }
- this._taskMap.clear()
- this._queue = []
+ this._holdingTasks = null
}
}
diff --git a/src/common/utils/typeChecks.ts b/src/common/utils/typeChecks.ts
index c5b06fbac..b83b2706d 100644
--- a/src/common/utils/typeChecks.ts
+++ b/src/common/utils/typeChecks.ts
@@ -29,11 +29,8 @@ export function merge (target: any, source: any): void {
) {
merge(targetProp, sourceProp)
} else {
- // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access -- ignore
- if (isValid(source[key])) {
- // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-member-access -- ignore
- target[key] = clone(source[key])
- }
+ // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-member-access -- ignore
+ target[key] = clone(sourceProp)
}
}
}
diff --git a/src/component/Indicator.ts b/src/component/Indicator.ts
index a4caf1d10..ff7776d6d 100644
--- a/src/component/Indicator.ts
+++ b/src/component/Indicator.ts
@@ -15,7 +15,7 @@
import type Nullable from '../common/Nullable'
import type DeepPartial from '../common/DeepPartial'
import type ExcludePickPartial from '../common/ExcludePickPartial'
-import type { KLineData, NeighborData, Timestamp } from '../common/Data'
+import type { KLineData, NeighborData } from '../common/Data'
import type Bounding from '../common/Bounding'
import type BarSpace from '../common/BarSpace'
import type Crosshair from '../common/Crosshair'
@@ -99,7 +99,7 @@ export interface IndicatorDrawParams {
export type IndicatorDrawCallback = (params: IndicatorDrawParams) => boolean
-export type IndicatorCalcCallback = (dataList: KLineData[], indicator: Indicator) => Promise> | Record
+export type IndicatorCalcCallback = (dataList: KLineData[], indicator: Indicator) => Promise | D[]
export type IndicatorShouldUpdateCallback = (prev: Indicator, current: Indicator) => (boolean | { calc: boolean, draw: boolean })
@@ -111,7 +111,6 @@ export interface IndicatorOnDataStateChangeParams {
indicator: Indicator
}
-export type IndicatorOnDataStateChangeCallback = (params: IndicatorOnDataStateChangeParams) => void
export interface Indicator {
/**
@@ -219,15 +218,10 @@ export interface Indicator {
*/
draw: Nullable>
- /**
- * Data state change
- */
- onDataStateChange: Nullable>
-
/**
* Calculation result
*/
- result: Record
+ result: D[]
}
export type IndicatorTemplate = ExcludePickPartial, 'result' | 'paneId'>, 'name' | 'calc'>
@@ -244,7 +238,7 @@ export type EachFigureCallback = (figure: IndicatorFigure, figureStyles: I
export function eachFigures (
indicator: Indicator,
- timestamps: NeighborData>,
+ dataIndex: number,
defaultStyles: IndicatorStyle,
eachFigureCallback: EachFigureCallback
): void {
@@ -295,9 +289,9 @@ export function eachFigures (
if (isValid(figure.type)) {
const ss = figure.styles?.({
data: {
- prev: result[timestamps.prev ?? ''],
- current: result[timestamps.current ?? ''],
- next: result[timestamps.next ?? '']
+ prev: result[dataIndex - 1],
+ current: result[dataIndex],
+ next: result[dataIndex + 1]
},
indicator,
defaultStyles
@@ -347,14 +341,12 @@ export default class IndicatorImp impleme
return { calc, draw }
}
- calc: IndicatorCalcCallback = () => ({})
+ calc: IndicatorCalcCallback = () => []
regenerateFigures: Nullable> = null
createTooltipDataSource: Nullable> = null
draw: Nullable> = null
- onDataStateChange: Nullable> = null
-
- result: Record = {}
+ result: D[] = []
private _prevIndicator: Indicator
private _lockSeriesPrecision = false
diff --git a/src/component/Overlay.ts b/src/component/Overlay.ts
index eed315947..683ade093 100644
--- a/src/component/Overlay.ts
+++ b/src/component/Overlay.ts
@@ -37,6 +37,13 @@ export interface OverlayPerformEventParams {
performPoint: Partial
}
+/**
+ * Drawing mode for overlays
+ * - 'step': Traditional click-based drawing (default)
+ * - 'continuous': Freehand drawing with mouse down, move, up
+ */
+export type OverlayDrawingMode = 'step' | 'continuous'
+
export interface OverlayEventCollection {
onDrawStart: Nullable>
onDrawing: Nullable>
@@ -124,6 +131,11 @@ export interface Overlay extends OverlayEventCollection {
*/
currentStep: number
+ /**
+ * Drawing mode: 'step' for click-based, 'continuous' for freehand
+ */
+ drawingMode: OverlayDrawingMode
+
/**
* Whether it is locked. When it is true, it will not respond to events
*/
@@ -229,6 +241,7 @@ export default class OverlayImp implements Overlay {
name: string
totalStep = 1
currentStep = OVERLAY_DRAW_STEP_START
+ drawingMode: OverlayDrawingMode = 'step'
lock = false
visible = true
zLevel = 0
@@ -237,7 +250,7 @@ export default class OverlayImp implements Overlay {
needDefaultYAxisFigure = false
mode: OverlayMode = 'normal'
modeSensitivity = 8
- points: Array>> = []
+ points: Array> = []
extendData: E
styles: Nullable> = null
createPointFigures: Nullable> = null
@@ -273,7 +286,10 @@ export default class OverlayImp implements Overlay {
}
override (overlay: Partial>): void {
- this._prevOverlay = clone(this)
+ this._prevOverlay = clone({
+ ...this,
+ _prevOverlay: null
+ })
const {
id,
@@ -369,6 +385,44 @@ export default class OverlayImp implements Overlay {
return this.currentStep === OVERLAY_DRAW_STEP_START
}
+ isContinuousDrawing (): boolean {
+ return this.drawingMode === 'continuous'
+ }
+
+ /**
+ * Add a point during continuous drawing mode
+ */
+ addPointForContinuousDrawing (point: Partial): boolean {
+ const newPoint: Partial = {}
+ if (isNumber(point.timestamp)) {
+ newPoint.timestamp = point.timestamp
+ }
+ if (isNumber(point.dataIndex)) {
+ newPoint.dataIndex = point.dataIndex
+ }
+ if (isNumber(point.value)) {
+ newPoint.value = point.value
+ }
+ this.points.push(newPoint)
+ return true
+ }
+
+ /**
+ * Start continuous drawing - set first point
+ */
+ startContinuousDrawing (point: Partial): void {
+ this.points = []
+ this.addPointForContinuousDrawing(point)
+ this.currentStep = 2 // Mark as actively drawing
+ }
+
+ /**
+ * Complete continuous drawing
+ */
+ completeContinuousDrawing (): void {
+ this.currentStep = OVERLAY_DRAW_STEP_FINISHED
+ }
+
eventMoveForDrawing (point: Partial): void {
const pointIndex = this.currentStep - 1
const newPoint: Partial = {}
diff --git a/src/component/YAxis.ts b/src/component/YAxis.ts
index b84a69202..1e7482843 100644
--- a/src/component/YAxis.ts
+++ b/src/component/YAxis.ts
@@ -120,31 +120,32 @@ export default abstract class YAxisImp extends AxisImp implements YAxis {
const areaValueKey = candleStyles.area.value
const shouldCompareHighLow = (inCandle && !isArea) || (!inCandle && shouldOhlc)
visibleRangeDataList.forEach((visibleData) => {
- const kLineData = visibleData.data.current
- if (isValid(kLineData)) {
+ const dataIndex = visibleData.dataIndex
+ const data = visibleData.data.current
+ if (isValid(data)) {
if (shouldCompareHighLow) {
- min = Math.min(min, kLineData.low)
- max = Math.max(max, kLineData.high)
+ min = Math.min(min, data.low)
+ max = Math.max(max, data.high)
}
if (inCandle && isArea) {
- const value = kLineData[areaValueKey]
+ const value = data[areaValueKey]
if (isNumber(value)) {
min = Math.min(min, value)
max = Math.max(max, value)
}
}
- indicators.forEach(({ result, figures }) => {
- const data = result[kLineData.timestamp] ?? {}
- figures.forEach(figure => {
+ }
+ indicators.forEach(({ result, figures }) => {
+ const data = result[dataIndex] ?? {}
+ figures.forEach(figure => {
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- ignore
- const value = data[figure.key]
- if (isNumber(value)) {
- min = Math.min(min, value)
- max = Math.max(max, value)
- }
- })
+ const value = data[figure.key]
+ if (isNumber(value)) {
+ min = Math.min(min, value)
+ max = Math.max(max, value)
+ }
})
- }
+ })
})
if (min !== Number.MAX_SAFE_INTEGER && max !== Number.MIN_SAFE_INTEGER) {
diff --git a/src/extension/figure/line.ts b/src/extension/figure/line.ts
index 6acf55ca5..2dae01de4 100644
--- a/src/extension/figure/line.ts
+++ b/src/extension/figure/line.ts
@@ -138,12 +138,27 @@ export function lineTo (ctx: CanvasRenderingContext2D, coordinates: Coordinate[]
}
}
-export function drawLine (ctx: CanvasRenderingContext2D, attrs: LineAttrs | LineAttrs[], styles: Partial): void {
+export function drawLine (ctx: CanvasRenderingContext2D, attrs: LineAttrs | LineAttrs[], styles: Partial & { lineCap?: CanvasLineCap, lineJoin?: CanvasLineJoin }): void {
let lines: LineAttrs[] = []
lines = lines.concat(attrs)
- const { style = 'solid', smooth = false, size = 1, color = 'currentColor', dashedValue = [2, 2] } = styles
+ const { style = 'solid', smooth = false, size = 1, color = 'currentColor', dashedValue = [2, 2], lineCap, lineJoin } = styles
ctx.lineWidth = size
ctx.strokeStyle = color
+ // Use explicit lineCap/lineJoin if provided, otherwise default based on smooth
+ if (lineCap !== undefined) {
+ ctx.lineCap = lineCap
+ } else if (smooth !== false && smooth !== 0) {
+ ctx.lineCap = 'round'
+ } else {
+ ctx.lineCap = 'butt'
+ }
+ if (lineJoin !== undefined) {
+ ctx.lineJoin = lineJoin
+ } else if (smooth !== false && smooth !== 0) {
+ ctx.lineJoin = 'round'
+ } else {
+ ctx.lineJoin = 'miter'
+ }
if (style === 'dashed') {
ctx.setLineDash(dashedValue)
} else {
diff --git a/src/extension/indicator/averagePrice.ts b/src/extension/indicator/averagePrice.ts
index e0cbd061c..a68a56c38 100644
--- a/src/extension/indicator/averagePrice.ts
+++ b/src/extension/indicator/averagePrice.ts
@@ -32,7 +32,7 @@ const averagePrice: IndicatorTemplate = {
calc: (dataList) => {
let totalTurnover = 0
let totalVolume = 0
- return dataList.reduce((prev, kLineData) => {
+ return dataList.map((kLineData) => {
const avp: Avp = {}
const turnover = kLineData.turnover ?? 0
const volume = kLineData.volume ?? 0
@@ -41,9 +41,8 @@ const averagePrice: IndicatorTemplate = {
if (totalVolume !== 0) {
avp.avp = totalTurnover / totalVolume
}
- prev[kLineData.timestamp] = avp
- return prev
- }, {})
+ return avp
+ })
}
}
diff --git a/src/extension/indicator/awesomeOscillator.ts b/src/extension/indicator/awesomeOscillator.ts
index eb803d578..0df8e941e 100644
--- a/src/extension/indicator/awesomeOscillator.ts
+++ b/src/extension/indicator/awesomeOscillator.ts
@@ -50,7 +50,7 @@ const awesomeOscillator: IndicatorTemplate = {
let longSum = 0
let short = 0
let long = 0
- return dataList.reduce((prev, kLineData, i) => {
+ return dataList.map((kLineData, i) => {
const ao: Ao = {}
const middle = (kLineData.low + kLineData.high) / 2
shortSum += middle
@@ -68,9 +68,8 @@ const awesomeOscillator: IndicatorTemplate = {
if (i >= maxPeriod - 1) {
ao.ao = short - long
}
- prev[kLineData.timestamp] = ao
- return prev
- }, {})
+ return ao
+ })
}
}
diff --git a/src/extension/indicator/bias.ts b/src/extension/indicator/bias.ts
index c1d0c7a26..658e71989 100644
--- a/src/extension/indicator/bias.ts
+++ b/src/extension/indicator/bias.ts
@@ -37,7 +37,7 @@ const bias: IndicatorTemplate = {
calc: (dataList, indicator) => {
const { calcParams: params, figures } = indicator
const closeSums: number[] = []
- return dataList.reduce((prev, kLineData, i) => {
+ return dataList.map((kLineData, i) => {
const bias: Bias = {}
const close = kLineData.close
params.forEach((p, index) => {
@@ -49,9 +49,8 @@ const bias: IndicatorTemplate = {
closeSums[index] -= dataList[i - (p - 1)].close
}
})
- prev[kLineData.timestamp] = bias
- return prev
- }, {})
+ return bias
+ })
}
}
diff --git a/src/extension/indicator/bollingerBands.ts b/src/extension/indicator/bollingerBands.ts
index c9dadc102..1f8d569a4 100644
--- a/src/extension/indicator/bollingerBands.ts
+++ b/src/extension/indicator/bollingerBands.ts
@@ -57,7 +57,7 @@ const bollingerBands: IndicatorTemplate = {
const params = indicator.calcParams
const p = params[0] - 1
let closeSum = 0
- return dataList.reduce((prev, kLineData, i) => {
+ return dataList.map((kLineData, i) => {
const close = kLineData.close
const boll: Boll = {}
closeSum += close
@@ -68,9 +68,8 @@ const bollingerBands: IndicatorTemplate = {
boll.dn = boll.mid - params[1] * md
closeSum -= dataList[i - p].close
}
- prev[kLineData.timestamp] = boll
- return prev
- }, {})
+ return boll
+ })
}
}
diff --git a/src/extension/indicator/brar.ts b/src/extension/indicator/brar.ts
index 666557f40..9254e57b0 100644
--- a/src/extension/indicator/brar.ts
+++ b/src/extension/indicator/brar.ts
@@ -42,7 +42,7 @@ const brar: IndicatorTemplate = {
let cyl = 0
let ho = 0
let ol = 0
- return dataList.reduce((prev, kLineData, i) => {
+ return dataList.map((kLineData, i) => {
const brar: Brar = {}
const high = kLineData.high
const low = kLineData.low
@@ -73,9 +73,8 @@ const brar: IndicatorTemplate = {
ho -= (agoHigh - agoOpen)
ol -= (agoOpen - agoLow)
}
- prev[kLineData.timestamp] = brar
- return prev
- }, {})
+ return brar
+ })
}
}
diff --git a/src/extension/indicator/bullAndBearIndex.ts b/src/extension/indicator/bullAndBearIndex.ts
index 25daec74e..1c228c537 100644
--- a/src/extension/indicator/bullAndBearIndex.ts
+++ b/src/extension/indicator/bullAndBearIndex.ts
@@ -37,7 +37,7 @@ const bullAndBearIndex: IndicatorTemplate = {
const maxPeriod = Math.max(...params)
const closeSums: number[] = []
const mas: number[] = []
- return dataList.reduce((prev, kLineData, i) => {
+ return dataList.map((kLineData, i) => {
const bbi: Bbi = {}
const close = kLineData.close
params.forEach((p, index) => {
@@ -54,9 +54,8 @@ const bullAndBearIndex: IndicatorTemplate = {
})
bbi.bbi = maSum / 4
}
- prev[kLineData.timestamp] = bbi
- return prev
- }, {})
+ return bbi
+ })
}
}
diff --git a/src/extension/indicator/commodityChannelIndex.ts b/src/extension/indicator/commodityChannelIndex.ts
index 47345c836..699ee6613 100644
--- a/src/extension/indicator/commodityChannelIndex.ts
+++ b/src/extension/indicator/commodityChannelIndex.ts
@@ -38,7 +38,7 @@ const commodityChannelIndex: IndicatorTemplate = {
const p = params[0] - 1
let tpSum = 0
const tpList: number[] = []
- return dataList.reduce((prev, kLineData, i) => {
+ return dataList.map((kLineData, i) => {
const cci: Cci = {}
const tp = (kLineData.high + kLineData.low + kLineData.close) / 3
tpSum += tp
@@ -55,9 +55,8 @@ const commodityChannelIndex: IndicatorTemplate = {
const agoTp = (dataList[i - p].high + dataList[i - p].low + dataList[i - p].close) / 3
tpSum -= agoTp
}
- prev[kLineData.timestamp] = cci
- return prev
- }, {})
+ return cci
+ })
}
}
diff --git a/src/extension/indicator/currentRatio.ts b/src/extension/indicator/currentRatio.ts
index a3df1fb8e..bb4e3ad37 100644
--- a/src/extension/indicator/currentRatio.ts
+++ b/src/extension/indicator/currentRatio.ts
@@ -63,8 +63,7 @@ const currentRatio: IndicatorTemplate = {
const ma3List: number[] = []
let ma4Sum = 0
const ma4List: number[] = []
- const crList: Cr[] = []
- const result: Record = {}
+ const result: Cr[] = []
dataList.forEach((kLineData, i) => {
const cr: Cr = {}
const prevData = dataList[i - 1] ?? kLineData
@@ -89,32 +88,31 @@ const currentRatio: IndicatorTemplate = {
if (i >= params[0] + params[1] + ma1ForwardPeriod - 3) {
cr.ma1 = ma1List[ma1List.length - 1 - ma1ForwardPeriod]
}
- ma1Sum -= (crList[i - (params[1] - 1)].cr ?? 0)
+ ma1Sum -= (result[i - (params[1] - 1)].cr ?? 0)
}
if (i >= params[0] + params[2] - 2) {
ma2List.push(ma2Sum / params[2])
if (i >= params[0] + params[2] + ma2ForwardPeriod - 3) {
cr.ma2 = ma2List[ma2List.length - 1 - ma2ForwardPeriod]
}
- ma2Sum -= (crList[i - (params[2] - 1)].cr ?? 0)
+ ma2Sum -= (result[i - (params[2] - 1)].cr ?? 0)
}
if (i >= params[0] + params[3] - 2) {
ma3List.push(ma3Sum / params[3])
if (i >= params[0] + params[3] + ma3ForwardPeriod - 3) {
cr.ma3 = ma3List[ma3List.length - 1 - ma3ForwardPeriod]
}
- ma3Sum -= (crList[i - (params[3] - 1)].cr ?? 0)
+ ma3Sum -= (result[i - (params[3] - 1)].cr ?? 0)
}
if (i >= params[0] + params[4] - 2) {
ma4List.push(ma4Sum / params[4])
if (i >= params[0] + params[4] + ma4ForwardPeriod - 3) {
cr.ma4 = ma4List[ma4List.length - 1 - ma4ForwardPeriod]
}
- ma4Sum -= (crList[i - (params[4] - 1)].cr ?? 0)
+ ma4Sum -= (result[i - (params[4] - 1)].cr ?? 0)
}
}
- crList.push(cr)
- result[kLineData.timestamp] = cr
+ result.push(cr)
})
return result
}
diff --git a/src/extension/indicator/differentOfMovingAverage.ts b/src/extension/indicator/differentOfMovingAverage.ts
index 88b8005f1..6b0cecc97 100644
--- a/src/extension/indicator/differentOfMovingAverage.ts
+++ b/src/extension/indicator/differentOfMovingAverage.ts
@@ -37,8 +37,7 @@ const differentOfMovingAverage: IndicatorTemplate = {
let closeSum1 = 0
let closeSum2 = 0
let dmaSum = 0
- const dmaList: Dma[] = []
- const result: Record = {}
+ const result: Dma[] = []
dataList.forEach((kLineData, i) => {
const dma: Dma = {}
const close = kLineData.close
@@ -61,11 +60,10 @@ const differentOfMovingAverage: IndicatorTemplate = {
dmaSum += dif
if (i >= maxPeriod + params[2] - 2) {
dma.ama = dmaSum / params[2]
- dmaSum -= (dmaList[i - (params[2] - 1)].dma ?? 0)
+ dmaSum -= (result[i - (params[2] - 1)].dma ?? 0)
}
}
- dmaList.push(dma)
- result[kLineData.timestamp] = dma
+ result.push(dma)
})
return result
}
diff --git a/src/extension/indicator/directionalMovementIndex.ts b/src/extension/indicator/directionalMovementIndex.ts
index 9b2bfc310..a370c735f 100644
--- a/src/extension/indicator/directionalMovementIndex.ts
+++ b/src/extension/indicator/directionalMovementIndex.ts
@@ -66,8 +66,7 @@ const directionalMovementIndex: IndicatorTemplate = {
let dmm = 0
let dxSum = 0
let adx = 0
- const dmiList: Dmi[] = []
- const result: Record = {}
+ const result: Dmi[] = []
dataList.forEach((kLineData, i) => {
const dmi: Dmi = {}
const prevKLineData = dataList[i - 1] ?? kLineData
@@ -116,12 +115,11 @@ const directionalMovementIndex: IndicatorTemplate = {
}
dmi.adx = adx
if (i >= params[0] * 2 + params[1] - 3) {
- dmi.adxr = ((dmiList[i - (params[1] - 1)].adx ?? 0) + adx) / 2
+ dmi.adxr = ((result[i - (params[1] - 1)].adx ?? 0) + adx) / 2
}
}
}
- dmiList.push(dmi)
- result[kLineData.timestamp] = dmi
+ result.push(dmi)
})
return result
}
diff --git a/src/extension/indicator/easeOfMovementValue.ts b/src/extension/indicator/easeOfMovementValue.ts
index c9f3d4434..7cd631501 100644
--- a/src/extension/indicator/easeOfMovementValue.ts
+++ b/src/extension/indicator/easeOfMovementValue.ts
@@ -43,7 +43,7 @@ const easeOfMovementValue: IndicatorTemplate = {
const params = indicator.calcParams
let emvValueSum = 0
const emvValueList: number[] = []
- return dataList.reduce((prev, kLineData, i) => {
+ return dataList.map((kLineData, i) => {
const emv: Emv = {}
if (i > 0) {
const prevKLineData = dataList[i - 1]
@@ -65,9 +65,8 @@ const easeOfMovementValue: IndicatorTemplate = {
emvValueSum -= emvValueList[i - params[0]]
}
}
- prev[kLineData.timestamp] = emv
- return prev
- }, {})
+ return emv
+ })
}
}
diff --git a/src/extension/indicator/exponentialMovingAverage.ts b/src/extension/indicator/exponentialMovingAverage.ts
index 238421ea5..2c058a80c 100644
--- a/src/extension/indicator/exponentialMovingAverage.ts
+++ b/src/extension/indicator/exponentialMovingAverage.ts
@@ -40,7 +40,7 @@ const exponentialMovingAverage: IndicatorTemplate = {
const { calcParams: params, figures } = indicator
let closeSum = 0
const emaValues: number[] = []
- return dataList.reduce((prev, kLineData, i) => {
+ return dataList.map((kLineData, i) => {
const ema = {}
const close = kLineData.close
closeSum += close
@@ -54,9 +54,8 @@ const exponentialMovingAverage: IndicatorTemplate = {
ema[figures[index].key] = emaValues[index]
}
})
- prev[kLineData.timestamp] = ema
- return prev
- }, {})
+ return ema
+ })
}
}
diff --git a/src/extension/indicator/momentum.ts b/src/extension/indicator/momentum.ts
index e614974be..b428d7dd7 100644
--- a/src/extension/indicator/momentum.ts
+++ b/src/extension/indicator/momentum.ts
@@ -34,8 +34,7 @@ const momentum: IndicatorTemplate = {
calc: (dataList, indicator) => {
const params = indicator.calcParams
let mtmSum = 0
- const mtmList: Mtm[] = []
- const result: Record = {}
+ const result: Mtm[] = []
dataList.forEach((kLineData, i) => {
const mtm: Mtm = {}
if (i >= params[0]) {
@@ -45,11 +44,10 @@ const momentum: IndicatorTemplate = {
mtmSum += mtm.mtm
if (i >= params[0] + params[1] - 1) {
mtm.maMtm = mtmSum / params[1]
- mtmSum -= (mtmList[i - (params[1] - 1)].mtm ?? 0)
+ mtmSum -= (result[i - (params[1] - 1)].mtm ?? 0)
}
}
- mtmList.push(mtm)
- result[kLineData.timestamp] = mtm
+ result.push(mtm)
})
return result
}
diff --git a/src/extension/indicator/movingAverage.ts b/src/extension/indicator/movingAverage.ts
index a28bab8a5..ef27066e1 100644
--- a/src/extension/indicator/movingAverage.ts
+++ b/src/extension/indicator/movingAverage.ts
@@ -41,7 +41,7 @@ const movingAverage: IndicatorTemplate = {
calc: (dataList, indicator) => {
const { calcParams: params, figures } = indicator
const closeSums: number[] = []
- return dataList.reduce((prev, kLineData, i) => {
+ return dataList.map((kLineData, i) => {
const ma = {}
const close = kLineData.close
params.forEach((p, index) => {
@@ -51,9 +51,8 @@ const movingAverage: IndicatorTemplate = {
closeSums[index] -= dataList[i - (p - 1)].close
}
})
- prev[kLineData.timestamp] = ma
- return prev
- }, {})
+ return ma
+ })
}
}
diff --git a/src/extension/indicator/movingAverageConvergenceDivergence.ts b/src/extension/indicator/movingAverageConvergenceDivergence.ts
index 6964474e7..19f6add5f 100644
--- a/src/extension/indicator/movingAverageConvergenceDivergence.ts
+++ b/src/extension/indicator/movingAverageConvergenceDivergence.ts
@@ -68,7 +68,7 @@ const movingAverageConvergenceDivergence: IndicatorTemplate = {
let difSum = 0
let dea = 0
const maxPeriod = Math.max(params[0], params[1])
- return dataList.reduce((prev, kLineData, i) => {
+ return dataList.map((kLineData, i) => {
const macd: Macd = {}
const close = kLineData.close
closeSum += close
@@ -100,9 +100,8 @@ const movingAverageConvergenceDivergence: IndicatorTemplate = {
macd.dea = dea
}
}
- prev[kLineData.timestamp] = macd
- return prev
- }, {})
+ return macd
+ })
}
}
diff --git a/src/extension/indicator/onBalanceVolume.ts b/src/extension/indicator/onBalanceVolume.ts
index 9d710d0aa..c0d2620bd 100644
--- a/src/extension/indicator/onBalanceVolume.ts
+++ b/src/extension/indicator/onBalanceVolume.ts
@@ -35,8 +35,7 @@ const onBalanceVolume: IndicatorTemplate = {
const params = indicator.calcParams
let obvSum = 0
let oldObv = 0
- const obvList: Obv[] = []
- const result: Record = {}
+ const result: Obv[] = []
dataList.forEach((kLineData, i) => {
const prevKLineData = dataList[i - 1] ?? kLineData
if (kLineData.close < prevKLineData.close) {
@@ -48,10 +47,9 @@ const onBalanceVolume: IndicatorTemplate = {
obvSum += oldObv
if (i >= params[0] - 1) {
obv.maObv = obvSum / params[0]
- obvSum -= (obvList[i - (params[0] - 1)].obv ?? 0)
+ obvSum -= (result[i - (params[0] - 1)].obv ?? 0)
}
- obvList.push(obv)
- result[kLineData.timestamp] = obv
+ result.push(obv)
})
return result
}
diff --git a/src/extension/indicator/priceAndVolumeTrend.ts b/src/extension/indicator/priceAndVolumeTrend.ts
index 165fca3bf..4b96016cc 100644
--- a/src/extension/indicator/priceAndVolumeTrend.ts
+++ b/src/extension/indicator/priceAndVolumeTrend.ts
@@ -33,7 +33,7 @@ const priceAndVolumeTrend: IndicatorTemplate = {
],
calc: (dataList) => {
let sum = 0
- return dataList.reduce((prev, kLineData, i) => {
+ return dataList.map((kLineData, i) => {
const pvt: Pvt = {}
const close = kLineData.close
const volume = kLineData.volume ?? 1
@@ -45,9 +45,8 @@ const priceAndVolumeTrend: IndicatorTemplate = {
}
sum += x
pvt.pvt = sum
- prev[kLineData.timestamp] = pvt
- return prev
- }, {})
+ return pvt
+ })
}
}
diff --git a/src/extension/indicator/psychologicalLine.ts b/src/extension/indicator/psychologicalLine.ts
index 938379265..04bbef4ff 100644
--- a/src/extension/indicator/psychologicalLine.ts
+++ b/src/extension/indicator/psychologicalLine.ts
@@ -36,8 +36,7 @@ const psychologicalLine: IndicatorTemplate = {
let upCount = 0
let psySum = 0
const upList: number[] = []
- const psyList: Psy[] = []
- const result: Record = {}
+ const result: Psy[] = []
dataList.forEach((kLineData, i) => {
const psy: Psy = {}
const prevClose = (dataList[i - 1] ?? kLineData).close
@@ -49,12 +48,11 @@ const psychologicalLine: IndicatorTemplate = {
psySum += psy.psy
if (i >= params[0] + params[1] - 2) {
psy.maPsy = psySum / params[1]
- psySum -= (psyList[i - (params[1] - 1)].psy ?? 0)
+ psySum -= (result[i - (params[1] - 1)].psy ?? 0)
}
upCount -= upList[i - (params[0] - 1)]
}
- psyList.push(psy)
- result[kLineData.timestamp] = psy
+ result.push(psy)
})
return result
}
diff --git a/src/extension/indicator/rateOfChange.ts b/src/extension/indicator/rateOfChange.ts
index 8a46ddb4a..8f889acd1 100644
--- a/src/extension/indicator/rateOfChange.ts
+++ b/src/extension/indicator/rateOfChange.ts
@@ -33,8 +33,7 @@ const rateOfChange: IndicatorTemplate = {
],
calc: (dataList, indicator) => {
const params = indicator.calcParams
- const rocList: Roc[] = []
- const result: Record = {}
+ const result: Roc[] = []
let rocSum = 0
dataList.forEach((kLineData, i) => {
const roc: Roc = {}
@@ -49,11 +48,10 @@ const rateOfChange: IndicatorTemplate = {
rocSum += roc.roc
if (i >= params[0] - 1 + params[1] - 1) {
roc.maRoc = rocSum / params[1]
- rocSum -= (rocList[i - (params[1] - 1)].roc ?? 0)
+ rocSum -= (result[i - (params[1] - 1)].roc ?? 0)
}
}
- rocList.push(roc)
- result[kLineData.timestamp] = roc
+ result.push(roc)
})
return result
}
diff --git a/src/extension/indicator/relativeStrengthIndex.ts b/src/extension/indicator/relativeStrengthIndex.ts
index 979139b32..d8bd555fb 100644
--- a/src/extension/indicator/relativeStrengthIndex.ts
+++ b/src/extension/indicator/relativeStrengthIndex.ts
@@ -41,7 +41,7 @@ const relativeStrengthIndex: IndicatorTemplate = {
const { calcParams: params, figures } = indicator
const sumCloseAs: number[] = []
const sumCloseBs: number[] = []
- return dataList.reduce((prev, kLineData, i) => {
+ return dataList.map((kLineData, i) => {
const rsi = {}
const prevClose = (dataList[i - 1] ?? kLineData).close
const tmp = kLineData.close - prevClose
@@ -67,9 +67,8 @@ const relativeStrengthIndex: IndicatorTemplate = {
}
}
})
- prev[kLineData.timestamp] = rsi
- return prev
- }, {})
+ return rsi
+ })
}
}
diff --git a/src/extension/indicator/simpleMovingAverage.ts b/src/extension/indicator/simpleMovingAverage.ts
index bde0dc9d1..00ac1d9cd 100644
--- a/src/extension/indicator/simpleMovingAverage.ts
+++ b/src/extension/indicator/simpleMovingAverage.ts
@@ -35,7 +35,7 @@ const simpleMovingAverage: IndicatorTemplate = {
const params = indicator.calcParams
let closeSum = 0
let smaValue = 0
- return dataList.reduce((prev, kLineData, i) => {
+ return dataList.map((kLineData, i) => {
const sma: Sma = {}
const close = kLineData.close
closeSum += close
@@ -47,9 +47,8 @@ const simpleMovingAverage: IndicatorTemplate = {
}
sma.sma = smaValue
}
- prev[kLineData.timestamp] = sma
- return prev
- }, {})
+ return sma
+ })
}
}
diff --git a/src/extension/indicator/stoch.ts b/src/extension/indicator/stoch.ts
index c126bbf6d..91b478585 100644
--- a/src/extension/indicator/stoch.ts
+++ b/src/extension/indicator/stoch.ts
@@ -42,8 +42,7 @@ const stoch: IndicatorTemplate = {
],
calc: (dataList, indicator) => {
const params = indicator.calcParams
- const kdjList: Kdj[] = []
- const result: Record = {}
+ const result: Kdj[] = []
dataList.forEach((kLineData, i) => {
const kdj: Kdj = {}
const close = kLineData.close
@@ -53,12 +52,11 @@ const stoch: IndicatorTemplate = {
const ln = lhn[1]
const hnSubLn = hn - ln
const rsv = (close - ln) / (hnSubLn === 0 ? 1 : hnSubLn) * 100
- kdj.k = ((params[1] - 1) * (kdjList[i - 1]?.k ?? 50) + rsv) / params[1]
- kdj.d = ((params[2] - 1) * (kdjList[i - 1]?.d ?? 50) + kdj.k) / params[2]
+ kdj.k = ((params[1] - 1) * (result[i - 1]?.k ?? 50) + rsv) / params[1]
+ kdj.d = ((params[2] - 1) * (result[i - 1]?.d ?? 50) + kdj.k) / params[2]
kdj.j = 3.0 * kdj.k - 2.0 * kdj.d
}
- kdjList.push(kdj)
- result[kLineData.timestamp] = kdj
+ result.push(kdj)
})
return result
}
diff --git a/src/extension/indicator/stopAndReverse.ts b/src/extension/indicator/stopAndReverse.ts
index b4dec0d9f..0fb10eb60 100644
--- a/src/extension/indicator/stopAndReverse.ts
+++ b/src/extension/indicator/stopAndReverse.ts
@@ -58,7 +58,7 @@ const stopAndReverse: IndicatorTemplate = {
// 判断是上涨还是下跌 false：下跌
let isIncreasing = false
let sar = 0
- return dataList.reduce((prev, kLineData, i) => {
+ return dataList.map((kLineData, i) => {
// 上一个周期的sar
const preSar = sar
const high = kLineData.high
@@ -99,9 +99,8 @@ const stopAndReverse: IndicatorTemplate = {
sar = highMax
}
}
- prev[kLineData.timestamp] = { high, low, sar }
- return prev
- }, {})
+ return { high, low, sar }
+ })
}
}
diff --git a/src/extension/indicator/tripleExponentiallySmoothedAverage.ts b/src/extension/indicator/tripleExponentiallySmoothedAverage.ts
index be0aca82d..7518ab517 100644
--- a/src/extension/indicator/tripleExponentiallySmoothedAverage.ts
+++ b/src/extension/indicator/tripleExponentiallySmoothedAverage.ts
@@ -49,8 +49,7 @@ const tripleExponentiallySmoothedAverage: IndicatorTemplate = {
let ema1Sum = 0
let ema2Sum = 0
let trixSum = 0
- const trixList: Trix[] = []
- const result: Record = {}
+ const result: Trix[] = []
dataList.forEach((kLineData, i) => {
const trix: Trix = {}
const close = kLineData.close
@@ -83,13 +82,12 @@ const tripleExponentiallySmoothedAverage: IndicatorTemplate = {
trixSum += trixValue
if (i >= params[0] * 3 + params[1] - 4) {
trix.maTrix = trixSum / params[1]
- trixSum -= (trixList[i - (params[1] - 1)].trix ?? 0)
+ trixSum -= (result[i - (params[1] - 1)].trix ?? 0)
}
}
}
}
- trixList.push(trix)
- result[kLineData.timestamp] = trix
+ result.push(trix)
})
return result
}
diff --git a/src/extension/indicator/volume.ts b/src/extension/indicator/volume.ts
index b640c0679..741d3f30b 100644
--- a/src/extension/indicator/volume.ts
+++ b/src/extension/indicator/volume.ts
@@ -69,7 +69,7 @@ const volume: IndicatorTemplate = {
calc: (dataList, indicator) => {
const { calcParams: params, figures } = indicator
const volSums: number[] = []
- return dataList.reduce((prev, kLineData, i) => {
+ return dataList.map((kLineData, i) => {
const volume = kLineData.volume ?? 0
const vol: Vol = { volume, open: kLineData.open, close: kLineData.close }
params.forEach((p, index) => {
@@ -79,9 +79,8 @@ const volume: IndicatorTemplate = {
volSums[index] -= (dataList[i - (p - 1)].volume ?? 0)
}
})
- prev[kLineData.timestamp] = vol
- return prev
- }, {})
+ return vol
+ })
}
}
diff --git a/src/extension/indicator/volumeRatio.ts b/src/extension/indicator/volumeRatio.ts
index d63e0b5da..017ddf565 100644
--- a/src/extension/indicator/volumeRatio.ts
+++ b/src/extension/indicator/volumeRatio.ts
@@ -41,8 +41,7 @@ const volumeRatio: IndicatorTemplate = {
let dvs = 0
let pvs = 0
let vrSum = 0
- const vrList: Vr[] = []
- const result: Record = {}
+ const result: Vr[] = []
dataList.forEach((kLineData, i) => {
const vr: Vr = {}
const close = kLineData.close
@@ -65,7 +64,7 @@ const volumeRatio: IndicatorTemplate = {
vrSum += vr.vr
if (i >= params[0] + params[1] - 2) {
vr.maVr = vrSum / params[1]
- vrSum -= (vrList[i - (params[1] - 1)].vr ?? 0)
+ vrSum -= (result[i - (params[1] - 1)].vr ?? 0)
}
const agoData = dataList[i - (params[0] - 1)]
@@ -80,8 +79,7 @@ const volumeRatio: IndicatorTemplate = {
pvs -= agoVolume
}
}
- vrList.push(vr)
- result[kLineData.timestamp] = vr
+ result.push(vr)
})
return result
}
diff --git a/src/extension/indicator/williamsR.ts b/src/extension/indicator/williamsR.ts
index 7564dc87e..c9d2c8e71 100644
--- a/src/extension/indicator/williamsR.ts
+++ b/src/extension/indicator/williamsR.ts
@@ -39,7 +39,7 @@ const williamsR: IndicatorTemplate = {
regenerateFigures: (params) => params.map((_, i) => ({ key: `wr${i + 1}`, title: `WR${i + 1}: `, type: 'line' })),
calc: (dataList, indicator) => {
const { calcParams: params, figures } = indicator
- return dataList.reduce((prev, kLineData, i) => {
+ return dataList.map((kLineData, i) => {
const wr: Wr = {}
const close = kLineData.close
params.forEach((param, index) => {
@@ -52,9 +52,8 @@ const williamsR: IndicatorTemplate = {
wr[figures[index].key] = hnSubLn === 0 ? 0 : (close - hn) / hnSubLn * 100
}
})
- prev[kLineData.timestamp] = wr
- return prev
- }, {})
+ return wr
+ })
}
}
diff --git a/src/extension/overlay/freePath.ts b/src/extension/overlay/freePath.ts
new file mode 100644
index 000000000..02c56a70f
--- /dev/null
+++ b/src/extension/overlay/freePath.ts
@@ -0,0 +1,46 @@
+/**
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+
+ * http://www.apache.org/licenses/LICENSE-2.0
+
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import type { OverlayTemplate } from '../../component/Overlay'
+
+/**
+ * Free path overlay - freehand drawing with click and drag
+ * Uses continuous drawing mode for smooth path creation
+ */
+const freePath: OverlayTemplate = {
+ name: 'freePath',
+ totalStep: 2,
+ drawingMode: 'continuous',
+ needDefaultPointFigure: false,
+ needDefaultXAxisFigure: false,
+ needDefaultYAxisFigure: false,
+ createPointFigures: ({ coordinates }) => {
+ if (coordinates.length < 2) {
+ return []
+ }
+ return [
+ {
+ type: 'line',
+ attrs: { coordinates },
+ styles: {
+ smooth: false,
+ lineCap: 'round',
+ lineJoin: 'round'
+ }
+ }
+ ]
+ }
+}
+
+export default freePath
diff --git a/src/extension/overlay/index.ts b/src/extension/overlay/index.ts
index 8f65651c1..883cc8892 100644
--- a/src/extension/overlay/index.ts
+++ b/src/extension/overlay/index.ts
@@ -32,6 +32,7 @@ import verticalStraightLine from './verticalStraightLine'
import simpleAnnotation from './simpleAnnotation'
import simpleTag from './simpleTag'
+import freePath from './freePath'
const overlays: Record = {}
@@ -39,7 +40,7 @@ const extensions = [
fibonacciLine, horizontalRayLine, horizontalSegment, horizontalStraightLine,
parallelStraightLine, priceChannelLine, priceLine, rayLine, segment,
straightLine, verticalRayLine, verticalSegment, verticalStraightLine,
- simpleAnnotation, simpleTag
+ simpleAnnotation, simpleTag, freePath
]
extensions.forEach((template: OverlayTemplate) => {
diff --git a/src/index.ts b/src/index.ts
index 672f722c2..ffe3cfe5e 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -46,9 +46,9 @@ import {
import { calcTextWidth } from './common/utils/canvas'
import type { ActionType } from './common/Action'
import type { IndicatorSeries } from './component/Indicator'
-import type { OverlayMode } from './component/Overlay'
+import type { OverlayMode, OverlayDrawingMode } from './component/Overlay'
-import type { FormatDateType, Options, ZoomAnchor } from './Options'
+import type { FormatDateType, Options, BarSpaceLimit, ZoomAnchor } from './Options'
import ChartImp, { type Chart, type DomPosition } from './Chart'
import { checkCoordinateOnArc } from './extension/figure/arc'
@@ -174,6 +174,6 @@ export {
registerXAxis, registerYAxis,
utils,
type LineType, type PolygonType, type TooltipShowRule, type TooltipShowType, type FeatureType, type TooltipFeaturePosition, type CandleTooltipRectPosition,
- type CandleType, type FormatDateType, type ZoomAnchor,
- type DomPosition, type ActionType, type IndicatorSeries, type OverlayMode
+ type CandleType, type FormatDateType, type BarSpaceLimit, type ZoomAnchor,
+ type DomPosition, type ActionType, type IndicatorSeries, type OverlayMode, type OverlayDrawingMode
}
diff --git a/src/view/CandleBarView.ts b/src/view/CandleBarView.ts
index c1f56a5e2..fe44b2638 100644
--- a/src/view/CandleBarView.ts
+++ b/src/view/CandleBarView.ts
@@ -55,6 +55,7 @@ export default class CandleBarView extends ChildrenView {
halfOhlcSize = Math.floor(ohlcSize / 2)
}
const yAxis = pane.getAxisComponent()
+
this.eachChildren((visibleData, barSpace) => {
const { x, data: { current, prev } } = visibleData
if (isValid(current)) {
@@ -86,7 +87,8 @@ export default class CandleBarView extends ChildrenView {
const correction = barSpace.gapBar % 2 === 0 ? 1 : 0
let rects: Array>> = []
switch (type) {
- case 'candle_solid': {
+ case 'candle_solid':
+ case 'heikin_ashi': {
rects = this._createSolidBar(x, priceY, barSpace, colors, correction)
break
}
@@ -150,7 +152,7 @@ export default class CandleBarView extends ChildrenView {
this.createFigure(rect, handler ?? undefined)?.draw(ctx)
})
}
- })
+ }, true)
}
}
diff --git a/src/view/CandleLastPriceLabelView.ts b/src/view/CandleLastPriceLabelView.ts
index bd3cc1608..3e7ec7df0 100644
--- a/src/view/CandleLastPriceLabelView.ts
+++ b/src/view/CandleLastPriceLabelView.ts
@@ -35,8 +35,9 @@ export default class CandleLastPriceLabelView extends View {
if (priceMarkStyles.show && lastPriceMarkStyles.show && lastPriceMarkTextStyles.show) {
const precision = chartStore.getSymbol()?.pricePrecision ?? SymbolDefaultPrecisionConstants.PRICE
const yAxis = pane.getAxisComponent() as YAxis
- const dataList = chartStore.getDataList()
+ const dataList = chartStore.getDataList(true)
const data = dataList[dataList.length - 1]
+
if (isValid(data)) {
const { close, open } = data
const comparePrice = lastPriceMarkStyles.compareRule === 'current_open' ? open : (dataList[dataList.length - 2]?.close ?? close)
diff --git a/src/view/CandleLastPriceLineView.ts b/src/view/CandleLastPriceLineView.ts
index 3d08764e3..14de1bd59 100644
--- a/src/view/CandleLastPriceLineView.ts
+++ b/src/view/CandleLastPriceLineView.ts
@@ -28,8 +28,9 @@ export default class CandleLastPriceView extends View {
const lastPriceMarkLineStyles = lastPriceMarkStyles.line
if (priceMarkStyles.show && lastPriceMarkStyles.show && lastPriceMarkLineStyles.show) {
const yAxis = pane.getAxisComponent() as YAxis
- const dataList = chartStore.getDataList()
+ const dataList = chartStore.getDataList(true)
const data = dataList[dataList.length - 1]
+
if (isValid(data)) {
const { close, open } = data
const comparePrice = lastPriceMarkStyles.compareRule === 'current_open' ? open : (dataList[dataList.length - 2]?.close ?? close)
diff --git a/src/view/ChildrenView.ts b/src/view/ChildrenView.ts
index ec517159d..f55813f87 100644
--- a/src/view/ChildrenView.ts
+++ b/src/view/ChildrenView.ts
@@ -24,10 +24,10 @@ export type EachChildCallback = (
) => void
export default abstract class ChildrenView extends View {
- protected eachChildren (childCallback: EachChildCallback): void {
+ protected eachChildren (childCallback: EachChildCallback, mutateToCandleType = false): void {
const pane = this.getWidget().getPane()
const chartStore = pane.getChart().getChartStore()
- const visibleRangeDataList = chartStore.getVisibleRangeDataList()
+ const visibleRangeDataList = chartStore.getVisibleRangeDataList(mutateToCandleType)
const barSpace = chartStore.getBarSpace()
const dataLength = visibleRangeDataList.length
let index = 0
diff --git a/src/view/CrosshairFeatureView.ts b/src/view/CrosshairFeatureView.ts
index 19b497bce..183b3ad9a 100644
--- a/src/view/CrosshairFeatureView.ts
+++ b/src/view/CrosshairFeatureView.ts
@@ -117,7 +117,7 @@ export default class CrosshairFeatureView extends View {
finalBackgroundColor = activeBackgroundColor ?? backgroundColor
}
const eventHandler = {
- mouseClickEvent: this._featureClickEvent({ crosshair, feature }),
+ mouseDownEvent: this._featureClickEvent({ crosshair, feature }),
mouseMoveEvent: this._featureMouseMoveEvent({ crosshair, feature })
}
if (type === 'icon_font') {
diff --git a/src/view/IndicatorLastValueView.ts b/src/view/IndicatorLastValueView.ts
index 26a6dbeec..e873fe139 100644
--- a/src/view/IndicatorLastValueView.ts
+++ b/src/view/IndicatorLastValueView.ts
@@ -33,67 +33,58 @@ export default class IndicatorLastValueView extends View {
const yAxis = pane.getAxisComponent()
const yAxisRange = yAxis.getRange()
const dataList = chartStore.getDataList()
- const kLineData = dataList[dataList.length - 1] ?? {}
- const prevKLineData = dataList[dataList.length - 2] ?? {}
+ const dataIndex = dataList.length - 1
const indicators = chartStore.getIndicatorsByPaneId(pane.getId())
const formatter = chartStore.getInnerFormatter()
const decimalFold = chartStore.getDecimalFold()
const thousandsSeparator = chartStore.getThousandsSeparator()
indicators.forEach(indicator => {
const result = indicator.result
- const data = result[kLineData.timestamp] ?? result[prevKLineData.timestamp] ?? {}
+ const data = result[dataIndex] ?? {}
if (isValid(data) && indicator.visible) {
const precision = indicator.precision
- eachFigures(
- indicator,
- {
- prev: prevKLineData.timestamp,
- current: kLineData.timestamp,
- next: null
- },
- defaultStyles,
- (figure: IndicatorFigure, figureStyles: Required) => {
+ eachFigures(indicator, dataIndex, defaultStyles, (figure: IndicatorFigure, figureStyles: Required) => {
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- ignore
- const value = data[figure.key]
- if (isNumber(value)) {
- const y = yAxis.convertToNicePixel(value)
- let text = yAxis.displayValueToText(
- yAxis.realValueToDisplayValue(
- yAxis.valueToRealValue(value, { range: yAxisRange }),
- { range: yAxisRange }
- ),
- precision
- )
- if (indicator.shouldFormatBigNumber) {
- text = formatter.formatBigNumber(text)
- }
- text = decimalFold.format(thousandsSeparator.format(text))
- let x = 0
- let textAlign: CanvasTextAlign = 'left'
- if (yAxis.isFromZero()) {
- x = 0
- textAlign = 'left'
- } else {
- x = bounding.width
- textAlign = 'right'
- }
-
- this.createFigure({
- name: 'text',
- attrs: {
- x,
- y,
- text,
- align: textAlign,
- baseline: 'middle'
- },
- styles: {
- ...lastValueMarkTextStyles,
- backgroundColor: figureStyles.color
- }
- })?.draw(ctx)
+ const value = data[figure.key]
+ if (isNumber(value)) {
+ const y = yAxis.convertToNicePixel(value)
+ let text = yAxis.displayValueToText(
+ yAxis.realValueToDisplayValue(
+ yAxis.valueToRealValue(value, { range: yAxisRange }),
+ { range: yAxisRange }
+ ),
+ precision
+ )
+ if (indicator.shouldFormatBigNumber) {
+ text = formatter.formatBigNumber(text)
}
- })
+ text = decimalFold.format(thousandsSeparator.format(text))
+ let x = 0
+ let textAlign: CanvasTextAlign = 'left'
+ if (yAxis.isFromZero()) {
+ x = 0
+ textAlign = 'left'
+ } else {
+ x = bounding.width
+ textAlign = 'right'
+ }
+
+ this.createFigure({
+ name: 'text',
+ attrs: {
+ x,
+ y,
+ text,
+ align: textAlign,
+ baseline: 'middle'
+ },
+ styles: {
+ ...lastValueMarkTextStyles,
+ backgroundColor: figureStyles.color
+ }
+ })?.draw(ctx)
+ }
+ })
}
})
}
diff --git a/src/view/IndicatorTooltipView.ts b/src/view/IndicatorTooltipView.ts
index af47d2935..f97a38661 100644
--- a/src/view/IndicatorTooltipView.ts
+++ b/src/view/IndicatorTooltipView.ts
@@ -213,7 +213,7 @@ export default class IndicatorTooltipView extends View {
featureInfo.indicator = indicator
}
const eventHandler = {
- mouseClickEvent: this._featureClickEvent(actionType, featureInfo),
+ mouseDownEvent: this._featureClickEvent(actionType, featureInfo),
mouseMoveEvent: this._featureMouseMoveEvent(featureInfo)
}
let contentWidth = 0
@@ -343,37 +343,23 @@ export default class IndicatorTooltipView extends View {
const thousandsSeparator = chartStore.getThousandsSeparator()
const legends: TooltipLegend[] = []
if (indicator.visible) {
- const kLineDataList = chartStore.getDataList()
- const kLineData = kLineDataList[dataIndex] ?? {}
- const prevKLineData = kLineDataList[dataIndex - 1] ?? {}
- let data = result[kLineData.timestamp]
- if (!isValid(data) && dataIndex === kLineDataList.length - 1) {
- data = result[prevKLineData.timestamp]
- }
+ const data = result[dataIndex] ?? {}
const defaultValue = tooltipStyles.legend.defaultValue
- eachFigures(
- indicator,
- {
- prev: prevKLineData.timestamp,
- current: kLineData.timestamp,
- next: kLineDataList[dataIndex]?.timestamp
- },
- styles,
- (figure: IndicatorFigure, figureStyles: Required) => {
- if (isString(figure.title)) {
- const color = figureStyles.color
- // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- ignore
- let value = data?.[figure.key]
- if (isNumber(value)) {
- value = formatPrecision(value, indicator.precision)
- if (indicator.shouldFormatBigNumber) {
- value = formatter.formatBigNumber(value as string)
- }
- value = decimalFold.format(thousandsSeparator.format(value as string))
+ eachFigures(indicator, dataIndex, styles, (figure: IndicatorFigure, figureStyles: Required) => {
+ if (isString(figure.title)) {
+ const color = figureStyles.color
+ // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- ignore
+ let value = data[figure.key]
+ if (isNumber(value)) {
+ value = formatPrecision(value, indicator.precision)
+ if (indicator.shouldFormatBigNumber) {
+ value = formatter.formatBigNumber(value as string)
}
- legends.push({ title: { text: figure.title, color }, value: { text: (value ?? defaultValue) as string, color } })
+ value = decimalFold.format(thousandsSeparator.format(value as string))
}
- })
+ legends.push({ title: { text: figure.title, color }, value: { text: (value ?? defaultValue) as string, color } })
+ }
+ })
tooltipData.legends = legends
}
diff --git a/src/view/IndicatorView.ts b/src/view/IndicatorView.ts
index fb583476a..c44a835de 100644
--- a/src/view/IndicatorView.ts
+++ b/src/view/IndicatorView.ts
@@ -96,112 +96,104 @@ export default class IndicatorView extends CandleBarView {
this.eachChildren((data, barSpace) => {
const { halfGapBar } = barSpace
- const { dataIndex, x, data: kLineNeighborData } = data
+ const { dataIndex, x } = data
const prevX = xAxis.convertToPixel(dataIndex - 1)
const nextX = xAxis.convertToPixel(dataIndex + 1)
- // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- ignore
- const prevData: Record = result[kLineNeighborData.prev?.timestamp ?? ''] ?? {}
- // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- ignore
- const currentData: Record = result[kLineNeighborData.current?.timestamp ?? ''] ?? {}
- // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- ignore
- const nextData: Record = result[kLineNeighborData.next?.timestamp ?? ''] ?? {}
+ const prevData = result[dataIndex - 1] ?? null
+ const currentData = result[dataIndex] ?? null
+ const nextData = result[dataIndex + 1] ?? null
const prevCoordinate = { x: prevX }
const currentCoordinate = { x }
const nextCoordinate = { x: nextX }
indicator.figures.forEach(({ key }) => {
- const prevValue = prevData[key]
+ // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- ignore
+ const prevValue = prevData?.[key]
if (isNumber(prevValue)) {
prevCoordinate[key] = yAxis.convertToPixel(prevValue)
}
- const currentValue = currentData[key]
+ // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- ignore
+ const currentValue = currentData?.[key]
if (isNumber(currentValue)) {
currentCoordinate[key] = yAxis.convertToPixel(currentValue)
}
- const nextValue = nextData[key]
+ // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- ignore
+ const nextValue = nextData?.[key]
if (isNumber(nextValue)) {
nextCoordinate[key] = yAxis.convertToPixel(nextValue)
}
})
- eachFigures(
- indicator,
- {
- prev: kLineNeighborData.prev?.timestamp ?? null,
- current: kLineNeighborData.current?.timestamp ?? null,
- next: kLineNeighborData.next?.timestamp ?? null
- },
- defaultStyles,
- (figure: IndicatorFigure, figureStyles: IndicatorFigureStyle, figureIndex: number) => {
- if (isValid(currentData[figure.key])) {
+ eachFigures(indicator, dataIndex, defaultStyles, (figure: IndicatorFigure, figureStyles: IndicatorFigureStyle, figureIndex: number) => {
+ if (isValid(currentData?.[figure.key])) {
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- ignore
- const valueY = currentCoordinate[figure.key]
- let attrs = figure.attrs?.({
- data: { prev: prevData, current: currentData, next: nextData },
- coordinate: { prev: prevCoordinate, current: currentCoordinate, next: nextCoordinate },
- bounding,
- barSpace,
- xAxis,
- yAxis
- })
- if (!isValid(attrs)) {
- switch (figure.type) {
- case 'circle': {
+ const valueY = currentCoordinate[figure.key]
+ let attrs = figure.attrs?.({
+ data: { prev: prevData, current: currentData, next: nextData },
+ coordinate: { prev: prevCoordinate, current: currentCoordinate, next: nextCoordinate },
+ bounding,
+ barSpace,
+ xAxis,
+ yAxis
+ })
+ if (!isValid(attrs)) {
+ switch (figure.type) {
+ case 'circle': {
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- ignore
- attrs = { x, y: valueY, r: Math.max(1, halfGapBar) }
- break
+ attrs = { x, y: valueY, r: Math.max(1, halfGapBar) }
+ break
+ }
+ case 'rect':
+ case 'bar': {
+ const baseValue = figure.baseValue ?? yAxis.getRange().from
+ const baseValueY = yAxis.convertToPixel(baseValue)
+ let height = Math.abs(baseValueY - (valueY as number))
+ if (baseValue !== currentData?.[figure.key]) {
+ height = Math.max(1, height)
}
- case 'rect':
- case 'bar': {
- const baseValue = figure.baseValue ?? yAxis.getRange().from
- const baseValueY = yAxis.convertToPixel(baseValue)
- let height = Math.abs(baseValueY - (valueY as number))
- if (baseValue !== currentData[figure.key]) {
- height = Math.max(1, height)
- }
- let y = 0
- if (valueY > baseValueY) {
- y = baseValueY
- } else {
+ let y = 0
+ if (valueY > baseValueY) {
+ y = baseValueY
+ } else {
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- ignore
- y = valueY
- }
- attrs = {
- x: x - halfGapBar,
- y,
- width: Math.max(1, halfGapBar * 2),
- height
- }
- break
+ y = valueY
+ }
+ attrs = {
+ x: x - halfGapBar,
+ y,
+ width: Math.max(1, halfGapBar * 2),
+ height
}
- case 'line': {
- if (!isValid(lines[figureIndex])) {
- lines[figureIndex] = []
- }
- if (isNumber(currentCoordinate[figure.key]) && isNumber(nextCoordinate[figure.key])) {
- lines[figureIndex].push({
- coordinates: [
+ break
+ }
+ case 'line': {
+ if (!isValid(lines[figureIndex])) {
+ lines[figureIndex] = []
+ }
+ if (isNumber(currentCoordinate[figure.key]) && isNumber(nextCoordinate[figure.key])) {
+ lines[figureIndex].push({
+ coordinates: [
+ // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- ignore
+ { x: currentCoordinate.x, y: currentCoordinate[figure.key] },
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- ignore
- { x: currentCoordinate.x, y: currentCoordinate[figure.key] },
- // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- ignore
- { x: nextCoordinate.x, y: nextCoordinate[figure.key] }
- ],
- styles: figureStyles as unknown as SmoothLineStyle
- })
- }
- break
+ { x: nextCoordinate.x, y: nextCoordinate[figure.key] }
+ ],
+ styles: figureStyles as unknown as SmoothLineStyle
+ })
}
- default: { break }
+ break
}
- }
- const type = figure.type!
- if (isValid(attrs) && type !== 'line') {
- this.createFigure({
- name: type === 'bar' ? 'rect' : type,
- attrs,
- styles: figureStyles
- })?.draw(ctx)
+ default: { break }
}
}
- })
+ const type = figure.type!
+ if (isValid(attrs) && type !== 'line') {
+ this.createFigure({
+ name: type === 'bar' ? 'rect' : type,
+ attrs,
+ styles: figureStyles
+ })?.draw(ctx)
+ }
+ }
+ })
})
// merge line and render
diff --git a/src/view/OverlayView.ts b/src/view/OverlayView.ts
index 2a179fd6c..29e49efd8 100644
--- a/src/view/OverlayView.ts
+++ b/src/view/OverlayView.ts
@@ -165,7 +165,32 @@ export default class OverlayView extends View {
}
}
return false
+ }).registerEvent('mouseDownEvent', event => {
+ // Handle continuous drawing mode - start drawing on mouse down
+ const progressOverlayInfo = chartStore.getProgressOverlayInfo()
+ if (progressOverlayInfo !== null) {
+ const overlay = progressOverlayInfo.overlay
+ if (overlay.isContinuousDrawing() && overlay.isStart()) {
+ chartStore.updateProgressOverlayInfo(paneId, true)
+ const point = this._coordinateToPoint(overlay, event)
+ overlay.startContinuousDrawing(point)
+ overlay.onDrawStart?.({ chart, overlay, ...event })
+ return true
+ }
+ }
+ return false
}).registerEvent('mouseUpEvent', event => {
+ // Handle continuous drawing mode - complete on mouse up
+ const progressOverlayInfo = chartStore.getProgressOverlayInfo()
+ if (progressOverlayInfo !== null) {
+ const overlay = progressOverlayInfo.overlay
+ if (overlay.isContinuousDrawing() && overlay.isDrawing() && !overlay.isStart()) {
+ overlay.completeContinuousDrawing()
+ chartStore.progressOverlayComplete()
+ overlay.onDrawEnd?.({ chart, overlay, ...event })
+ return true
+ }
+ }
const { overlay, figure } = chartStore.getPressedOverlayInfo()
if (overlay !== null) {
if (checkOverlayFigureEvent('onPressedMoveEnd', figure)) {
@@ -181,6 +206,17 @@ export default class OverlayView extends View {
})
return false
}).registerEvent('pressedMouseMoveEvent', event => {
+ // Handle continuous drawing mode - accumulate points while mouse is pressed
+ const progressOverlayInfo = chartStore.getProgressOverlayInfo()
+ if (progressOverlayInfo !== null) {
+ const overlay = progressOverlayInfo.overlay
+ if (overlay.isContinuousDrawing() && overlay.isDrawing() && !overlay.isStart()) {
+ const point = this._coordinateToPoint(overlay, event)
+ overlay.addPointForContinuousDrawing(point)
+ overlay.onDrawing?.({ chart, overlay, ...event })
+ return true
+ }
+ }
const { overlay, figureType, figureIndex, figure } = chartStore.getPressedOverlayInfo()
if (overlay !== null) {
if (checkOverlayFigureEvent('onPressedMoving', figure)) {
@@ -345,11 +381,19 @@ export default class OverlayView extends View {
const paneId = pane.getId()
const chartStore = chart.getChartStore()
if (this.coordinateToPointTimestampDataIndexFlag()) {
- const xAxis = chart.getXAxisPane().getAxisComponent()
- const dataIndex = xAxis.convertFromPixel(coordinate.x)
- const timestamp = chartStore.dataIndexToTimestamp(dataIndex) ?? undefined
- point.timestamp = timestamp
- point.dataIndex = dataIndex
+ const overlayImp = o as OverlayImp
+ if (overlayImp.isContinuousDrawing() && !overlayImp.isStart()) {
+ // For continuous drawing, store precise timestamp for sub-bar positioning
+ const floatIndex = chartStore.coordinateToFloatIndex(coordinate.x)
+ point.dataIndex = floatIndex
+ point.timestamp = chartStore.floatIndexToTimestamp(floatIndex) ?? undefined
+ } else {
+ // For step-based drawing, snap to candle boundaries
+ const xAxis = chart.getXAxisPane().getAxisComponent()
+ const dataIndex = xAxis.convertFromPixel(coordinate.x)
+ point.dataIndex = dataIndex
+ point.timestamp = chartStore.dataIndexToTimestamp(dataIndex) ?? undefined
+ }
}
if (this.coordinateToPointValueFlag()) {
const yAxis = pane.getAxisComponent()
@@ -415,7 +459,8 @@ export default class OverlayView extends View {
}
override dispatchEvent (name: EventName, event: MouseTouchEvent): boolean {
- if (this.getWidget().getPane().getChart().getChartStore().isOverlayDrawing()) {
+ const isDrawing = this.getWidget().getPane().getChart().getChartStore().isOverlayDrawing()
+ if (isDrawing) {
return this.onEvent(name, event)
}
return super.dispatchEvent(name, event)
@@ -443,15 +488,23 @@ export default class OverlayView extends View {
const chart = pane.getChart()
const chartStore = chart.getChartStore()
const yAxis = pane.getAxisComponent() as unknown as Nullable
- const xAxis = chart.getXAxisPane().getAxisComponent()
+ // For continuous drawing overlays, use float indices for smooth rendering
+ const isContinuous = overlay.isContinuousDrawing()
const coordinates = points.map(point => {
let dataIndex: Nullable = null
- if (isNumber(point.timestamp)) {
+ if (isContinuous && isNumber(point.timestamp)) {
+ // Use timestampToFloatIndex for sub-bar precision
+ dataIndex = chartStore.timestampToFloatIndex(point.timestamp)
+ } else if (isNumber(point.timestamp)) {
+ // For regular overlays, use integer timestamp lookup
dataIndex = chartStore.timestampToDataIndex(point.timestamp)
+ } else if (isNumber(point.dataIndex)) {
+ // Fallback to dataIndex if no timestamp
+ dataIndex = point.dataIndex
}
const coordinate = { x: 0, y: 0 }
if (isNumber(dataIndex)) {
- coordinate.x = xAxis.convertToPixel(dataIndex)
+ coordinate.x = chartStore.dataIndexToCoordinate(dataIndex)
}
if (isNumber(point.value)) {
coordinate.y = yAxis?.convertToPixel(point.value) ?? 0
+
+
+
+
+
+
\ No newline at end of file
diff --git a/docs/@components/Tip.vue b/docs/@components/Tip.vue
new file mode 100644
index 000000000..f6d3c9305
--- /dev/null
+++ b/docs/@components/Tip.vue
@@ -0,0 +1,97 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/docs/@i18n/en-US.json b/docs/@i18n/en-US.json
index 0b6b41c26..fbd34f2e3 100644
--- a/docs/@i18n/en-US.json
+++ b/docs/@i18n/en-US.json
@@ -1,7 +1,7 @@
{
"view_banner_tip": "⚠️ Currently, the v10 alpha version is unstable, so it is recommended to use the 9.x version first.",
- "view_home_hero_title": "Highly customizable professional lightweight financial chart",
- "view_home_hero_desc": "Easy to use, lightweight and smooth, suitable for web front-end financial chart with rich scenarios.",
+ "view_home_hero_title": "Highly customizable professional financial chart",
+ "view_home_hero_desc": "Easy to use, lightweight and smooth, a perfect financial data visualization solution.",
"view_home_hero_button": "Getting Started",
"view_home_top_sponsor": "Top Sponsor",
"view_home_quick_create_chart_title": "Create chart easily and quickly",
diff --git a/docs/@i18n/zh-CN.json b/docs/@i18n/zh-CN.json
index aa6cdba34..fd7d6dd4b 100644
--- a/docs/@i18n/zh-CN.json
+++ b/docs/@i18n/zh-CN.json
@@ -1,7 +1,7 @@
{
"view_banner_tip": "⚠️ 目前 v10 alpha 版本不稳定，建议还是优先使用 9.x 版本。",
"view_home_hero_title": "可高度自定义的专业级轻量金融图表",
- "view_home_hero_desc": "简单易用，轻量流畅，适用场景丰富的 Web 前端金融图表。",
+ "view_home_hero_desc": "简单易用，轻量流畅，完美的金融数据可视化方案。",
"view_home_hero_button": "快速开始",
"view_home_top_sponsor": "顶级赞助商",
"view_home_quick_create_chart_title": "简单快速创建图表",
diff --git a/docs/@views/Banner.vue b/docs/@views/Banner.vue
index 23756a2de..e2d3dec3d 100644
--- a/docs/@views/Banner.vue
+++ b/docs/@views/Banner.vue
@@ -49,10 +49,9 @@ onMounted(() => {
background-color: var(--vp-c-bg);
overflow: hidden;
margin: 0;
- color: var(--vp-c-indigo-1);
+ color: #E6AC00;
font-size: 12px;
border-bottom: solid 1px var(--vp-c-gutter);
- transition: background-color 0.15s;
}
.banner span {
diff --git a/docs/@views/ColorPalette.vue b/docs/@views/ColorPalette.vue
new file mode 100644
index 000000000..13e52ddbe
--- /dev/null
+++ b/docs/@views/ColorPalette.vue
@@ -0,0 +1,174 @@
+
+
+
+
+
+
+
+
diff --git a/docs/@views/Layout.vue b/docs/@views/Layout.vue
index ebe284e10..f315fd85c 100644
--- a/docs/@views/Layout.vue
+++ b/docs/@views/Layout.vue
@@ -1,7 +1,7 @@
+
+
+
+
+ {{ props.title }}:
+
+
+
4
- 
+
@@ -27,7 +37,20 @@ onMounted(() => {
{{ i18n('view_404_desc_2', lang) }}
@@ -45,6 +68,7 @@ onMounted(() => {
flex-direction: row;
align-items: center;
justify-content: center;
+ gap: 20px;
}
.NotFound .logo span {
@@ -52,11 +76,6 @@ onMounted(() => {
font-weight: 600;
}
-.NotFound .logo img {
- width: 92px;
- margin: 0 22px
-}
-
@media (min-width: 768px) {
.NotFound {
padding: 128px 32px 168px;
@@ -76,22 +95,28 @@ onMounted(() => {
}
.action {
+ display: flex;
+ justify-content: center;
padding-top: 20px;
+ color: var(--vp-c-indigo-1);
}
.link {
- display: inline-block;
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ width: auto;
+ gap: 8px;
border: 1px solid var(--vp-c-brand);
border-radius: 16px;
- padding: 3px 16px;
+ padding: 4px 16px;
font-size: 14px;
font-weight: 500;
- color: var(--vp-c-brand);
- transition: border-color 0.2s, color 0.2s;
+ transition: all 0.3s ease;
}
.link:hover {
- border-color: var(--vp-c-brand-light);
- color: var(--vp-c-brand-light);
+ border-color: var(--vp-c-indigo-2);
+ color: var(--vp-c-indigo-2);
}
\ No newline at end of file
diff --git a/docs/@views/api/references/chart/init.md b/docs/@views/api/references/chart/init.md
index 0b4eebcb7..c5dfbfbfa 100644
--- a/docs/@views/api/references/chart/init.md
+++ b/docs/@views/api/references/chart/init.md
@@ -61,7 +61,7 @@
threshold?: number
format?: (value: number | string) => string
}
- zoomAnchor?: { main?: 'cursor_point' | 'last_bar', xAxis?: 'cursor_point' | 'last_bar' }
+ zoomAnchor?: 'cursor' | 'last_bar' | { main?: 'cursor' | 'last_bar', xAxis?: 'cursor' | 'last_bar' }
}
) => Chart
```
\ No newline at end of file
diff --git a/docs/@views/api/references/instance/getBarSpaceLimit.md b/docs/@views/api/references/instance/getBarSpaceLimit.md
new file mode 100644
index 000000000..a15524b08
--- /dev/null
+++ b/docs/@views/api/references/instance/getBarSpaceLimit.md
@@ -0,0 +1,3 @@
+```typescript
+() => BarSpaceLimit
+```
\ No newline at end of file
diff --git a/docs/@views/api/references/instance/setBarSpaceLimit.md b/docs/@views/api/references/instance/setBarSpaceLimit.md
new file mode 100644
index 000000000..01fcb314c
--- /dev/null
+++ b/docs/@views/api/references/instance/setBarSpaceLimit.md
@@ -0,0 +1,7 @@
+```typescript
+interface BarSpaceLimit {
+ min: number;
+ max: number;
+}
+(limit: BarSpaceLimit) => void
+```
\ No newline at end of file
diff --git a/docs/@views/api/samples/createOverlay-freePath/index.data.js b/docs/@views/api/samples/createOverlay-freePath/index.data.js
new file mode 100644
index 000000000..031b0d66f
--- /dev/null
+++ b/docs/@views/api/samples/createOverlay-freePath/index.data.js
@@ -0,0 +1,20 @@
+import fs from 'fs'
+
+export default {
+ watch: ['./index.js'],
+ load (watchedFiles) {
+ return watchedFiles.reduce((data, file) => {
+ const result = fs.readFileSync(file, 'utf-8')
+ let key
+ if (file.match('index.js')) {
+ key = 'js'
+ } else if (file.match('index.css')) {
+ key = 'css'
+ } else {
+ key = 'html'
+ }
+ data[key] = result
+ return data
+ }, {})
+ }
+}
diff --git a/docs/@views/api/samples/createOverlay-freePath/index.js b/docs/@views/api/samples/createOverlay-freePath/index.js
new file mode 100644
index 000000000..3b309f966
--- /dev/null
+++ b/docs/@views/api/samples/createOverlay-freePath/index.js
@@ -0,0 +1,30 @@
+import { init } from 'klinecharts'
+
+const chart = init('createOverlay-freePath-chart')
+
+chart.setSymbol({ ticker: 'TestSymbol' })
+chart.setPeriod({ span: 1, type: 'day' })
+chart.setDataLoader({
+ getBars: ({
+ callback
+ }) => {
+ fetch('https://klinecharts.com/datas/kline.json')
+ .then(res => res.json())
+ .then(dataList => {
+ callback(dataList)
+ })
+ }
+})
+
+function createFreePathOverlay() {
+ chart.createOverlay({
+ name: 'freePath',
+ onDrawEnd: () => {
+ // Automatically create a new freePath overlay after drawing is complete
+ createFreePathOverlay()
+ }
+ })
+}
+
+// Initialize the first freePath overlay
+createFreePathOverlay()
diff --git a/docs/@views/api/samples/createOverlay-freePath/index.vue b/docs/@views/api/samples/createOverlay-freePath/index.vue
new file mode 100644
index 000000000..1612479b4
--- /dev/null
+++ b/docs/@views/api/samples/createOverlay-freePath/index.vue
@@ -0,0 +1,11 @@
+
+
+
+
+
-
+
-
-
-
+
+
@@ -68,7 +56,9 @@
+
+
+
+ {{ i18n('view_home_hero_button', lang) }}
+
+
+
+
+
\ No newline at end of file
diff --git a/docs/@views/home/hero/TextLogo.vue b/docs/@views/home/hero/TextLogo.vue
new file mode 100644
index 000000000..ad9d17449
--- /dev/null
+++ b/docs/@views/home/hero/TextLogo.vue
@@ -0,0 +1,90 @@
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/docs/@views/home/hero/index.vue b/docs/@views/home/hero/index.vue
index 67767c078..bd7229301 100644
--- a/docs/@views/home/hero/index.vue
+++ b/docs/@views/home/hero/index.vue
@@ -2,31 +2,29 @@
import { useData } from 'vitepress'
import i18n from '../../../@i18n'
-import GithubStarButton from './GithubStarButton.vue';
+import TextLogo from './TextLogo.vue'
+import Slogan from './slogan/index.vue'
+import QuickStartButton from './QuickStartButton.vue'
+import GithubStarButton from './GithubStarButton.vue'
const { lang } = useData()
+
-
-
-
-
-
-
-
-
-
-
-
@@ -39,9 +37,11 @@ const { lang } = useData()
display: flex;
flex-direction: column;
align-items: center;
+ justify-content: center;
margin-top: calc((var(--vp-nav-height) + var(--vp-layout-top-height, 0px)) * -1);
- padding: calc(var(--vp-nav-height) + var(--vp-layout-top-height, 0px) + 48px) 24px 48px;
- /* background: var(--vp-home-hero-bg); */
+ padding: calc(var(--vp-nav-height) + var(--vp-layout-top-height, 0px) + 60px) 24px 80px 24px;
+ background: var(--vp-home-hero-bg);
+ transition: background .3s ease;
}
.container {
@@ -53,20 +53,6 @@ const { lang } = useData()
max-width: 1080px;
}
-.name {
- height: 22px;
-}
-
-.text {
- max-width: 460px;
- line-height: 36px;
- font-size: 30px;
- font-weight: 700;
- padding: 10px 0;
- white-space: pre-wrap;
- max-width: 80%;
-}
-
.tagline {
max-width: 392px;
line-height: 26px;
@@ -75,6 +61,8 @@ const { lang } = useData()
white-space: pre-wrap;
color: var(--vp-c-text-2);
max-width: 100%;
+ opacity: 0;
+ animation: toTop .6s ease forwards;
}
.actions {
@@ -84,61 +72,24 @@ const { lang } = useData()
gap: 12px;
padding-top: 32px;
font-weight: 500;
+ opacity: 0;
+ animation: toTop .6s ease forwards 0.6s;
}
-.quick-start-action {
- display: flex;
- flex-direction: row;
- align-items: center;
- border-radius: 99999px;
- cursor: pointer;
- border: solid 1px var(--vp-c-indigo-1);
- background-color: var(--vp-c-indigo-1);
- color: #fff;
- padding: 0 16px;
- height: 36px;
- font-size: 14px;
- transition: all 0.3s ease;
-}
-
-.quick-start-action:hover {
- background-color: var(--vp-c-indigo-2);
- border-color: var(--vp-c-indigo-2);
-}
-
-.quick-start-action svg {
- width: 12px;
- height: 12px;;
- fill: currentColor;
- transition: all 0.3s ease;
- margin-inline-start: 6px;
-}
-
-.quick-start-action:hover svg {
- animation: move 0.45s ease infinite alternate;
-}
-
-@keyframes move {
- 0% {
- transform: translateX(-1px);
+@keyframes toTop {
+ from {
+ opacity: 0;
+ transform: translateY(50px);
}
- 100% {
- transform: translateX(1px);
+ to {
+ opacity: 1;
+ transform: translateY(0);
}
}
@media (min-width: 640px) {
.hero {
- padding: calc(var(--vp-nav-height) + var(--vp-layout-top-height, 0px) + 80px) 48px 64px;
- }
- .name {
- height: 34px;
- }
- .text {
- line-height: 50px;
- font-size: 44px;
- padding: 14px 0 26px 0;
- max-width: 70%;
+ padding: calc(var(--vp-nav-height) + var(--vp-layout-top-height, 0px) + 100px) 48px 110px 48px;
}
.tagline {
max-width: 576px;
@@ -148,30 +99,11 @@ const { lang } = useData()
gap: 20px;
padding-top: 40px;
}
- .quick-start-action {
- height: 40px;
- font-size: 16px;
- padding: 0 20px;
- }
- .quick-start-action svg {
- width: 14px;
- height: 14px;
- margin-inline-start: 8px;
- }
}
@media (min-width: 960px) {
.hero {
- padding: calc(var(--vp-nav-height) + var(--vp-layout-top-height, 0px) + 100px) 64px 100px 64px;
- }
- .name {
- height: 40px;
- }
- .text {
- line-height: 60px;
- padding: 20px 0 34px 0;
- font-size: 54px;
- max-width: 700px;
+ padding: calc(var(--vp-nav-height) + var(--vp-layout-top-height, 0px) + 120px) 64px 120px 64px;
}
.tagline {
font-size: 24px;
diff --git a/docs/@views/home/hero/slogan/DropText.vue b/docs/@views/home/hero/slogan/DropText.vue
new file mode 100644
index 000000000..74243c324
--- /dev/null
+++ b/docs/@views/home/hero/slogan/DropText.vue
@@ -0,0 +1,107 @@
+
+
+
+ - {{ i18n('view_home_hero_title', lang) }} -
+{{ i18n('view_home_hero_desc', lang) }}
+
+
+ {{ char }}
+
+
+
+
+
+
\ No newline at end of file
diff --git a/docs/@views/home/hero/slogan/index.vue b/docs/@views/home/hero/slogan/index.vue
new file mode 100644
index 000000000..66e90f6bd
--- /dev/null
+++ b/docs/@views/home/hero/slogan/index.vue
@@ -0,0 +1,59 @@
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/docs/@views/styles/config.md b/docs/@views/styles/config.md
index 42ea74eac..cfa6d84bd 100644
--- a/docs/@views/styles/config.md
+++ b/docs/@views/styles/config.md
@@ -18,7 +18,7 @@ const styles = {
}
},
candle: {
- // 'candle_solid' | 'candle_stroke' | 'candle_up_stroke' | 'candle_down_stroke' | 'ohlc' | 'area'
+ // 'candle_solid' | 'candle_stroke' | 'candle_up_stroke' | 'candle_down_stroke' | 'ohlc' | 'area' | 'heikin_ashi'
type: 'candle_solid',
bar: {
// 'current_open' | 'previous_close'
diff --git a/docs/api/chart/init.md b/docs/api/chart/init.md
index 92e615e19..cefa5b044 100644
--- a/docs/api/chart/init.md
+++ b/docs/api/chart/init.md
@@ -2,12 +2,29 @@
outline: deep
---
+
+
# init(ds, options?)
`init` 用于初始化一个图表。
-::: tip 提示
-调用时，需要等待容器 `dom` 准备完成之后。
-:::
+