@363045841yyt/klinechart-core 0.7.12 → 0.7.13

package/src/engine/renderers/Indicator/trix.ts

@@ -1,5 +1,6 @@
 import type { RendererPluginWithHost, RenderContext, PluginHost } from '../../../plugin'
 import { RENDERER_PRIORITY } from '../../../plugin'
+import { resolveThemeColors } from '../../../tokens'
 import type { TRIXRenderState } from '../../indicators/trixState'
 import { createTRIXStateKey } from '../../indicators/trixState'
 import { EMPTY_TRIX_STATE } from '../../indicators/trixState'
@@ -8,6 +9,8 @@ import { Indicator } from '../../indicators/indicatorDefinitionRegistry'
 import { resolveStateKey } from '../../indicators/indicatorMetadata'
 import type { IndicatorScheduler, TRIXSchedulerConfig } from '../../indicators/scheduler'
 import { calcTRIXData } from '../../indicators/calculators'
+import type { KLineData } from '../../../types/price'
+import type { TitleInfo } from '../../indicators/indicatorMetadata'
 
 const TRIX_COLOR = '#e11d48'
 const SIGNAL_COLOR = '#f59e0b'
@@ -145,21 +148,48 @@ function drawLine(ctx: CanvasRenderingContext2D, pts: Point[], color: string): v
     ctx.stroke()
 }
 
+export function getTRIXTitleInfo(
+  _data: KLineData[],
+  index: number | null,
+  params: Record<string, number | boolean | string>,
+  pluginHost: PluginHost,
+  paneId: string,
+): TitleInfo | null {
+  if (index === null) return null
+  const period = (params.period as number) ?? 15
+  const signalPeriod = (params.signalPeriod as number) ?? 9
+  const state = pluginHost.getSharedState<TRIXRenderState>(createTRIXStateKey(paneId))
+  if (!state) return null
+
+  const values: Array<{ label: string; value: number; color: string }> = []
+
+  if (state.params.showTRIX) {
+    const v = state.series[index]
+    if (v !== undefined) values.push({ label: 'TRIX', value: v, color: TRIX_COLOR })
+  }
+  if (state.params.showSignal) {
+    const v = state.signalSeries[index]
+    if (v !== undefined) values.push({ label: 'Signal', value: v, color: SIGNAL_COLOR })
+  }
+
+  if (values.length === 0) return null
+
+  return {
+    name: 'TRIX',
+    params: [period, signalPeriod],
+    values,
+  }
+}
+
 @Indicator({
     name: 'trix',
     displayName: 'TRIX',
     category: 'oscillator',
-    stateKey: createTRIXStateKey,
     defaultPaneId: 'sub_TRIX',
     scale: { indicatorKey: 'trix', label: 'TRIX', decimals: 6 },
-    updateConfig: (scheduler, params, paneId) => {
-    (scheduler as IndicatorScheduler).updateIndicatorConfig('trix', params, paneId)
-  },
     visibleState: { compose: createDualSparseVisibleStateComposer('trix', EMPTY_TRIX_STATE) },
-    applyResult: (host, state, paneId) => {
-        host.setSharedState(createTRIXStateKey(paneId), state as any, 'indicator_scheduler')
-    },
-    runtime: { configKey:'trix', defaultConfig:{period:15,signalPeriod:9,showTRIX:true,showSignal:true}, computeKey:'calcTRIXData', compute:(data,c)=>calcTRIXData(data,c.period,c.signalPeriod) },
+    getTitleInfo: getTRIXTitleInfo,
+    runtime: { defaultConfig:{period:15,signalPeriod:9,showTRIX:true,showSignal:true}, computeKey:'calcTRIXData', compute:(data,c)=>calcTRIXData(data,c.period,c.signalPeriod) },
 })
 class TRIXIndicatorDefinition {
     static rendererFactory = createTRIXRendererPlugin

package/src/engine/renderers/Indicator/vma.ts

@@ -3,6 +3,8 @@ import { RENDERER_PRIORITY } from '../../../plugin'
 import type { VMARenderState } from '../../indicators/vmaState'
 import { createVMAStateKey } from '../../indicators/vmaState'
 import { EMPTY_VMA_STATE } from '../../indicators/vmaState'
+import type { TitleInfo } from '../../indicators/indicatorMetadata'
+import type { KLineData } from '../../../types/price'
 import { createNonNegativeSparseVisibleStateComposer } from '../../indicators/visibleStateComposers'
 import { Indicator } from '../../indicators/indicatorDefinitionRegistry'
 import { resolveStateKey } from '../../indicators/indicatorMetadata'
@@ -111,22 +113,35 @@ export function createVMARendererPlugin(options: { paneId?: string } = {}): Rend
     }
 }
 
+export function getVMATitleInfo(
+    _data: KLineData[],
+    index: number | null,
+    params: Record<string, number | boolean | string>,
+    host: PluginHost,
+    paneId: string,
+): TitleInfo | null {
+    if (index === null) return null
+    const period = (params.period as number) ?? 5
+    const state = host.getSharedState<VMARenderState>(createVMAStateKey(paneId))
+    const value = state?.series[index]
+    if (value === undefined) return null
+
+    return {
+        name: 'VMA',
+        params: [period],
+        values: [{ label: 'VMA', value, color: VMA_COLOR }],
+    }
+}
+
 @Indicator({
     name: 'vma',
     displayName: 'VMA',
     category: 'volume',
-    stateKey: createVMAStateKey,
     defaultPaneId: 'sub_VMA',
     scale: { indicatorKey: 'vma', label: 'VMA', decimals: 0 },
-    updateConfig: (scheduler, params, paneId) => {
-        (scheduler as IndicatorScheduler).updateIndicatorConfig('vma', params, paneId)
-    },
+    getTitleInfo: getVMATitleInfo,
     visibleState: { compose: createNonNegativeSparseVisibleStateComposer('vma', EMPTY_VMA_STATE) },
-    applyResult: (host, state, paneId) => {
-        host.setSharedState(createVMAStateKey(paneId), state as any, 'indicator_scheduler')
-    },
     runtime: {
-        configKey: 'vma',
         defaultConfig: { period: 5, showVMA: true },
         computeKey: 'calcVMAData',
         compute: (data, c) => calcVMAData(data, c.period),

package/src/engine/renderers/Indicator/volumeProfile.ts

@@ -7,6 +7,9 @@ import { createVolumeProfileVisibleStateComposer } from '../../indicators/visibl
 import { resolveStateKey } from '../../indicators/indicatorMetadata'
 import type { IndicatorScheduler, VolumeProfileSchedulerConfig } from '../../indicators/scheduler'
 import { calcVolumeProfileData } from '../../indicators/calculators'
+import type { TitleInfo } from '../../indicators/indicatorMetadata'
+import type { KLineData } from '../../../types/price'
+import { resolveThemeColors } from '../../../tokens'
 
 const BAR_FILL = 'rgba(99, 102, 241, 0.35)'
 const POC_COLOR = '#f59e0b'
@@ -111,21 +114,49 @@ export function createVolumeProfileRendererPlugin(options: { paneId?: string } =
     }
 }
 
+const VP_POC_COLOR = '#8b5cf6'
+const VP_VAH_COLOR = '#6366f1'
+const VP_VAL_COLOR = '#818cf8'
+
+export function getVolumeProfileTitleInfo(
+  _data: KLineData[],
+  index: number | null,
+  params: Record<string, number | boolean | string>,
+  host: PluginHost,
+  paneId: string,
+): TitleInfo | null {
+  if (index === null) return null
+  const bins = (params.bins as number) ?? 24
+  const state = host.getSharedState<VolumeProfileRenderState>(createVolumeProfileStateKey(paneId))
+  const vp = state?.series
+
+  const values: Array<{ label: string; value: number; color: string }> = []
+  if (vp && vp.bins.length > 0) {
+    if (state.params.showPOC) {
+      values.push({ label: 'POC', value: vp.poc, color: VP_POC_COLOR })
+    }
+    if (state.params.showValueArea) {
+      values.push({ label: 'VAH', value: vp.vah, color: VP_VAH_COLOR })
+      values.push({ label: 'VAL', value: vp.val, color: VP_VAL_COLOR })
+    }
+  }
+
+  return {
+    name: 'VP',
+    params: [bins],
+    values,
+  }
+}
+
 @Indicator({
     name: 'volumeProfile',
     displayName: 'VP',
     category: 'volume',
-    stateKey: createVolumeProfileStateKey,
     defaultPaneId: 'sub_VolumeProfile',
     scale: { indicatorKey: 'volumeProfile', label: 'VP', decimals: 0 },
+    getTitleInfo: getVolumeProfileTitleInfo,
     visibleState: { compose: createVolumeProfileVisibleStateComposer('volumeProfile', EMPTY_VOLUME_PROFILE_STATE) },
-    updateConfig: (scheduler, params, paneId) => {
-        (scheduler as IndicatorScheduler).updateIndicatorConfig('volumeProfile', params, paneId)
-    },
-    applyResult: (host, state, paneId) => {
-        host.setSharedState(createVolumeProfileStateKey(paneId), state as any, 'indicator_scheduler')
-    },
-    runtime: { configKey:'volumeProfile', defaultConfig:{bins:24,lookback:100,valueAreaPercent:70,showPOC:true,showValueArea:true}, computeKey:'calcVolumeProfileData', compute:(data,c)=>calcVolumeProfileData(data,c.bins,c.lookback,c.valueAreaPercent) },
+    runtime: { defaultConfig:{bins:24,lookback:100,valueAreaPercent:70,showPOC:true,showValueArea:true}, computeKey:'calcVolumeProfileData', compute:(data,c)=>calcVolumeProfileData(data,c.bins,c.lookback,c.valueAreaPercent) },
 })
 class VolumeProfileIndicatorDefinition {
     static rendererFactory = createVolumeProfileRendererPlugin

package/src/engine/renderers/Indicator/vwap.ts

@@ -7,6 +7,8 @@ import { resolveStateKey } from '../../indicators/indicatorMetadata'
 import { createSparseVisibleStateComposer } from '../../indicators/visibleStateComposers'
 import type { IndicatorScheduler, VWAPSchedulerConfig } from '../../indicators/scheduler'
 import { calcVWAPData } from '../../indicators/calculators'
+import type { TitleInfo } from '../../indicators/indicatorMetadata'
+import type { KLineData } from '../../../types/price'
 
 const VWAP_COLOR = '#ec4899'
 
@@ -109,22 +111,34 @@ export function createVWAPRendererPlugin(options: { paneId?: string } = {}): Ren
     }
 }
 
+export function getVWAPTitleInfo(
+  _data: KLineData[],
+  index: number | null,
+  _params: Record<string, number | boolean | string>,
+  host: PluginHost,
+  paneId: string,
+): TitleInfo | null {
+  if (index === null) return null
+  const state = host.getSharedState<VWAPRenderState>(createVWAPStateKey(paneId))
+  const value = state?.series[index]
+  if (value === undefined) return null
+
+  return {
+    name: 'VWAP',
+    params: [],
+    values: [{ label: 'VWAP', value, color: VWAP_COLOR }],
+  }
+}
+
 @Indicator({
     name: 'vwap',
     displayName: 'VWAP',
     category: 'volume',
-    stateKey: createVWAPStateKey,
     defaultPaneId: 'sub_VWAP',
     visibleState: { compose: createSparseVisibleStateComposer('vwap', EMPTY_VWAP_STATE) },
     scale: { indicatorKey: 'vwap', label: 'VWAP', decimals: 2 },
-    updateConfig: (scheduler, params, paneId) => {
-        (scheduler as IndicatorScheduler).updateIndicatorConfig('vwap', params, paneId)
-    },
-    applyResult: (host, state, paneId) => {
-        host.setSharedState(createVWAPStateKey(paneId), state as any, 'indicator_scheduler')
-    },
+    getTitleInfo: getVWAPTitleInfo,
     runtime: {
-        configKey: 'vwap',
         defaultConfig: { sessionResetGapMs: 0, showVWAP: true },
         computeKey: 'calcVWAPData',
         compute: (data, c) => calcVWAPData(data, c.sessionResetGapMs),

package/src/engine/renderers/Indicator/wma.ts

@@ -1,9 +1,10 @@
 import type { RendererPluginWithHost, RenderContext, PluginHost } from '../../../plugin'
+import type { KLineData } from '../../../types/price'
 import { RENDERER_PRIORITY } from '../../../plugin'
 import type { WMARenderState } from '../../indicators/wmaState'
 import { createWMAStateKey, EMPTY_WMA_STATE } from '../../indicators/wmaState'
 import { Indicator } from '../../indicators/indicatorDefinitionRegistry'
-import { resolveStateKey } from '../../indicators/indicatorMetadata'
+import { resolveStateKey, type TitleInfo, type TitleValueItem, type GetTitleInfoFn } from '../../indicators/indicatorMetadata'
 import { createSparseVisibleStateComposer } from '../../indicators/visibleStateComposers'
 import type { IndicatorScheduler, WMASchedulerConfig } from '../../indicators/scheduler'
 import { calcWMAData } from '../../indicators/calculators'
@@ -121,23 +122,40 @@ export function createWMARendererPlugin(options: WMARendererOptions = {}): Rende
     }
 }
 
+export const getWMATitleInfo: GetTitleInfoFn = (
+    _data: KLineData[],
+    index: number | null,
+    _params: Record<string, number | boolean | string>,
+    pluginHost: PluginHost,
+    paneId: string,
+): TitleInfo | null => {
+    if (index === null) return null
+
+    const stateKey = createWMAStateKey(paneId)
+    const state = pluginHost?.getSharedState<WMARenderState>(stateKey)
+    if (!state || state.visibleMin > state.visibleMax) return null
+
+    const value = state.series[index]
+    if (value === undefined) return null
+
+    return {
+        name: 'WMA',
+        params: [state.params.period],
+        values: [{ label: 'WMA', value, color: '#10b981' }],
+    }
+}
+
 @Indicator({
     name: 'wma',
     displayName: 'WMA',
+    getTitleInfo: getWMATitleInfo,
     category: 'main',
-    stateKey: createWMAStateKey,
     defaultPaneId: 'main',
     allowMainPane: true,
     mainPane: { rendererName: 'wma_main', toActiveConfig: (params, active) => ({ ...params, showWMA: active }) },
     visibleState: { compose: createSparseVisibleStateComposer('wma', EMPTY_WMA_STATE) },
     scale: { indicatorKey: 'wma', label: 'WMA', decimals: 2 },
-    updateConfig: (scheduler, params, paneId) => {
-        (scheduler as IndicatorScheduler).updateIndicatorConfig('wma', params, paneId)
-    },
-    applyResult: (host, state, paneId) => {
-        host.setSharedState(createWMAStateKey(paneId), state as any, 'indicator_scheduler')
-    },
-    runtime: { configKey:'wma', defaultConfig:{period:10,showWMA:true}, computeKey:'calcWMAData', compute:(data,c)=>calcWMAData(data,c.period) },
+    runtime: { defaultConfig:{period:10,showWMA:true}, computeKey:'calcWMAData', compute:(data,c)=>calcWMAData(data,c.period) },
 })
 class WMADefinition {
     static rendererFactory = createWMARendererPlugin

package/src/engine/renderers/Indicator/wmsr.ts

@@ -10,6 +10,7 @@ import { resolveStateKey } from '../../indicators/indicatorMetadata'
 import type { IndicatorScheduler, WMSRSchedulerConfig } from '../../indicators/scheduler'
 import { createWmsrScaleRendererPlugin } from './scale/wmsr_scale'
 import { calcWMSRData } from '../../indicators/calculators'
+import type { KLineData } from '../../../types/price'
 
 type LinePoint = { x: number; y: number }
 
@@ -293,14 +294,15 @@ function drawWMSRLineWithCanvas2D(
  * 获取 WMSR 标题信息（供 paneTitle 使用）
  */
 export function getWMSRTitleInfo(
-    index: number,
-    period: number,
+    _data: KLineData[],
+    index: number | null,
+    params: Record<string, number | boolean | string>,
     pluginHost: PluginHost,
-    paneId: string = 'sub_WMSR',
-    theme: 'light' | 'dark' = 'light',
-    isAsiaMarket?: boolean
+    paneId: string,
 ): { name: string; params: number[]; values: Array<{ label: string; value: number; color: string }> } | null {
-    const colors = resolveThemeColors(theme, isAsiaMarket)
+    if (index === null) return null
+    const period = (params.period as number) ?? 14
+    const colors = resolveThemeColors('light')
     const state = pluginHost.getSharedState<WMSRRenderState>(createWMSRStateKey(paneId))
     if (!state) return null
 
@@ -320,18 +322,11 @@ export function getWMSRTitleInfo(
     name: 'wmsr',
     displayName: 'WMSR',
     category: 'oscillator',
-    stateKey: createWMSRStateKey,
     defaultPaneId: 'sub_WMSR',
     visibleState: { compose: createFixedRangeSparseVisibleStateComposer('wmsr', EMPTY_WMSR_STATE) },
     scaleRendererFactory: createWmsrScaleRendererPlugin,
-    updateConfig: (scheduler, params, paneId) => {
-    (scheduler as IndicatorScheduler).updateIndicatorConfig('wmsr', params, paneId)
-  },
-    applyResult: (host, state, paneId) => {
-        host.setSharedState(createWMSRStateKey(paneId), state as any, 'indicator_scheduler')
-    },
+    getTitleInfo: getWMSRTitleInfo,
     runtime: {
-        configKey: 'wmsr',
         defaultConfig: { period: 14, showWMSR: true },
         computeKey: 'calcWMSRData',
         compute: (data, c) => calcWMSRData(data, c.period),

package/src/engine/renderers/Indicator/zones.ts

@@ -5,7 +5,7 @@ import type { ZonesRenderState } from '../../indicators/zonesState'
 import { createZonesStateKey, EMPTY_ZONES_STATE } from '../../indicators/zonesState'
 import { Indicator } from '../../indicators/indicatorDefinitionRegistry'
 import { createFixedUnitVisibleStateComposer } from '../../indicators/visibleStateComposers'
-import { resolveStateKey } from '../../indicators/indicatorMetadata'
+import { resolveStateKey, type TitleInfo, type TitleValueItem, type GetTitleInfoFn } from '../../indicators/indicatorMetadata'
 import type { IndicatorScheduler, ZonesSchedulerConfig } from '../../indicators/scheduler'
 import { calcZonesData } from '../../indicators/calculators'
 
@@ -90,23 +90,42 @@ export function createZonesRendererPlugin(options: { paneId?: string } = {}): Re
     }
 }
 
+export const getZonesTitleInfo: GetTitleInfoFn = (_data, index, _params, host, paneId) => {
+    if (index === null) return null
+
+    const stateKey = createZonesStateKey(paneId)
+    const state = host?.getSharedState<ZonesRenderState>(stateKey)
+    if (!state) return null
+
+    const activeZones = state.series.filter(
+        z => z.startIndex <= index && (z.endIndex === undefined || z.endIndex >= index)
+    )
+    if (activeZones.length === 0) return null
+
+    const values: TitleValueItem[] = activeZones.slice(0, 5).map(z => ({
+        label: z.kind,
+        value: z.high,
+        color: z.kind.includes('Bull') ? '#22c55e' : '#ef4444',
+    }))
+
+    return {
+        name: 'Zones',
+        params: [activeZones.length],
+        values,
+    }
+}
+
 @Indicator({
     name: 'zones',
     displayName: 'Zones',
+    getTitleInfo: getZonesTitleInfo,
     category: 'main',
-    stateKey: createZonesStateKey,
     defaultPaneId: 'main',
     allowMainPane: true,
     mainPane: { rendererName: 'zones_main', toActiveConfig: (params, active) => ({ ...params, showFVG: active, showOB: active, showFilledZones: active }) },
     scale: { indicatorKey: 'zones', label: 'Zones', decimals: 2 },
     visibleState: { compose: createFixedUnitVisibleStateComposer('zones', EMPTY_ZONES_STATE) },
-    updateConfig: (scheduler, params, paneId) => {
-        (scheduler as IndicatorScheduler).updateIndicatorConfig('zones', params, paneId)
-    },
-    applyResult: (host, state, paneId) => {
-        host.setSharedState(createZonesStateKey(paneId), state as any, 'indicator_scheduler')
-    },
-    runtime: { configKey:'zones', defaultConfig:{showFVG:true,showOB:true,showFilledZones:true,obLookback:20}, computeKey:'calcZonesData', compute:(data,c)=>calcZonesData(data,c.obLookback,5,2,'close') },
+    runtime: { defaultConfig:{showFVG:true,showOB:true,showFilledZones:true,obLookback:20}, computeKey:'calcZonesData', compute:(data,c)=>calcZonesData(data,c.obLookback,5,2,'close') },
 })
 class ZonesDefinition {
     static rendererFactory = createZonesRendererPlugin