@363045841yyt/klinechart-core 0.7.3

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

@@ -0,0 +1,124 @@
+import type { RendererPluginWithHost, RenderContext, PluginHost } from '../../../plugin'
+import { RENDERER_PRIORITY } from '../../../plugin'
+import type { VMARenderState } from '../../indicators/vmaState'
+import { createVMAStateKey } from '../../indicators/vmaState'
+import { Indicator } from '../../indicators/indicatorDefinitionRegistry'
+import { resolveStateKey } from '../../indicators/indicatorMetadata'
+import type { IndicatorScheduler } from '../../indicators/scheduler'
+
+const VMA_COLOR = '#0ea5e9'
+
+type LinePoint = { x: number; y: number }
+
+function getVMAStateKey(host: PluginHost | null, paneId: string): string | null {
+    const scheduler = host?.getService<IndicatorScheduler>('indicatorScheduler')
+    if (!scheduler) {
+        console.warn(`[VMARenderer] Scheduler not available via service locator`)
+        return null
+    }
+    const meta = scheduler.getIndicatorMetadata('vma')
+    if (!meta) {
+        console.warn(`[VMARenderer] Indicator metadata for 'vma' not found, skip rendering`)
+        return null
+    }
+    return resolveStateKey(meta.stateKey, paneId)
+}
+
+export function createVMARendererPlugin(options: { paneId?: string } = {}): RendererPluginWithHost {
+    const { paneId = 'sub_VMA' } = options
+    let pluginHost: PluginHost | null = null
+
+    function resolveKey(): string | null {
+        return getVMAStateKey(pluginHost, paneId)
+    }
+    return {
+        name: `vma_${paneId}`,
+        version: '1.1.0',
+        description: 'VMA 成交量均线渲染器（WebGL + Canvas2D 回退）',
+        debugName: 'VMA',
+        paneId,
+        priority: RENDERER_PRIORITY.MAIN,
+        onInstall(host) { pluginHost = host },
+        getDeclaredNamespaces() { const key = resolveKey(); return key ? [key] : [] },
+        draw(context: RenderContext) {
+            const { ctx, pane, range, scrollLeft, kLineCenters, lineWebGLSurface } = context
+            const stateKey = resolveKey()
+            if (!stateKey) return
+            const state = pluginHost?.getSharedState<VMARenderState>(stateKey)
+            if (!state || !state.params.showVMA || state.visibleMin > state.visibleMax) return
+
+            const { valueMin, valueMax, series } = state
+            const displayRange = pane.yAxis.getDisplayRange({ minPrice: valueMin, maxPrice: valueMax })
+            const displayMin = displayRange.minPrice
+            const displayMax = displayRange.maxPrice
+            const displayValueRange = displayMax - displayMin || 1
+
+            const paneH = pane.height
+            const invRange = paneH / displayValueRange
+            const rangeStart = range.start
+
+            const drawEnd = Math.min(range.end, series.length)
+            const points: LinePoint[] = []
+            for (let i = range.start; i < drawEnd; i++) {
+                const value = series[i]
+                if (value === undefined) continue
+                const centerX = kLineCenters[i - rangeStart]
+                if (centerX === undefined) continue
+                points.push({ x: centerX, y: paneH - (value - displayMin) * invRange })
+            }
+
+            if (points.length < 2) return
+
+            const enableWebGL = context.settings?.enableWebGLRendering !== false
+            let usedWebGL = false
+            if (enableWebGL && lineWebGLSurface?.isAvailable()) {
+                const allOk = lineWebGLSurface.drawLineStrips(
+                    [{ points, width: 1, color: VMA_COLOR }],
+                    scrollLeft,
+                )
+                if (allOk) {
+                    usedWebGL = true
+                    lineWebGLSurface.compositeTo(ctx, { imageSmoothingEnabled: false })
+                }
+            }
+
+            if (usedWebGL) return
+
+            ctx.save()
+            ctx.translate(-scrollLeft, 0)
+            ctx.strokeStyle = VMA_COLOR
+            ctx.lineWidth = 1
+            ctx.lineJoin = 'round'
+            ctx.lineCap = 'round'
+            ctx.beginPath()
+            ctx.moveTo(points[0]!.x, points[0]!.y)
+            for (let i = 1; i < points.length; i++) {
+                ctx.lineTo(points[i]!.x, points[i]!.y)
+            }
+            ctx.stroke()
+            ctx.restore()
+        },
+        getConfig() {
+            const stateKey = resolveKey()
+            if (!stateKey) return {}
+            const state = pluginHost?.getSharedState<VMARenderState>(stateKey)
+            return state?.params ?? {}
+        },
+        setConfig() { },
+    }
+}
+
+@Indicator({
+    name: 'vma',
+    displayName: 'VMA',
+    category: 'volume',
+    stateKey: createVMAStateKey,
+    defaultPaneId: 'sub_VMA',
+    paneIdField: 'vmaPaneId',
+    applyResult: (host, state, paneId) => {
+        host.setSharedState(createVMAStateKey(paneId), state as any, 'indicator_scheduler')
+    },
+})
+class VMAIndicatorDefinition {
+    static rendererFactory = createVMARendererPlugin
+}

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

@@ -0,0 +1,125 @@
+import type { RendererPluginWithHost, RenderContext, PluginHost } from '../../../plugin'
+import { RENDERER_PRIORITY } from '../../../plugin'
+import type { VolumeProfileRenderState } from '../../indicators/volumeProfileState'
+import { createVolumeProfileStateKey } from '../../indicators/volumeProfileState'
+import { Indicator } from '../../indicators/indicatorDefinitionRegistry'
+import { resolveStateKey } from '../../indicators/indicatorMetadata'
+import type { IndicatorScheduler } from '../../indicators/scheduler'
+
+const BAR_FILL = 'rgba(99, 102, 241, 0.35)'
+const POC_COLOR = '#f59e0b'
+const VA_COLOR = 'rgba(99, 102, 241, 0.6)'
+
+const PROFILE_WIDTH_PX = 80
+
+function getVolumeProfileStateKey(host: PluginHost | null, paneId: string): string | null {
+    const scheduler = host?.getService<IndicatorScheduler>('indicatorScheduler')
+    if (!scheduler) {
+        console.warn(`[VolumeProfileRenderer] Scheduler not available via service locator`)
+        return null
+    }
+    const meta = scheduler.getIndicatorMetadata('volumeProfile')
+    if (!meta) {
+        console.warn(`[VolumeProfileRenderer] Indicator metadata for 'volumeProfile' not found, skip rendering`)
+        return null
+    }
+    return resolveStateKey(meta.stateKey, paneId)
+}
+
+export function createVolumeProfileRendererPlugin(options: { paneId?: string } = {}): RendererPluginWithHost {
+    const { paneId = 'sub_VolumeProfile' } = options
+    let pluginHost: PluginHost | null = null
+
+    function resolveKey(): string | null {
+        return getVolumeProfileStateKey(pluginHost, paneId)
+    }
+    return {
+        name: `volumeProfile_${paneId}`,
+        version: '1.0.0',
+        description: 'Volume Profile 渲染器（POC + Value Area + 价格-成交量直方图）',
+        debugName: 'VolumeProfile',
+        paneId,
+        priority: RENDERER_PRIORITY.MAIN,
+        onInstall(host) { pluginHost = host },
+        getDeclaredNamespaces() { const key = resolveKey(); return key ? [key] : [] },
+        draw(context: RenderContext) {
+            const { ctx, pane, scrollLeft } = context
+            const stateKey = resolveKey()
+            if (!stateKey) return
+            const state = pluginHost?.getSharedState<VolumeProfileRenderState>(stateKey)
+            if (!state) return
+            const { bins, poc, vah, val, totalVolume } = state.series
+            if (bins.length === 0 || totalVolume <= 0) return
+            const { showPOC, showValueArea } = state.params
+
+            const displayRange = pane.yAxis.getDisplayRange()
+            const displayMin = displayRange.minPrice
+            const displayValueRange = (displayRange.maxPrice - displayMin) || 1
+            const toY = (v: number) => pane.height - (v - displayMin) / displayValueRange * pane.height
+
+            const maxBinVolume = Math.max(...bins.map((b) => b.volume))
+            if (maxBinVolume <= 0) return
+
+            ctx.save()
+            ctx.translate(-scrollLeft, 0)
+            const profileX = scrollLeft + context.paneWidth - PROFILE_WIDTH_PX
+
+            ctx.fillStyle = BAR_FILL
+            for (const bin of bins) {
+                const yTop = toY(bin.priceHigh)
+                const yBot = toY(bin.priceLow)
+                const barWidth = (bin.volume / maxBinVolume) * PROFILE_WIDTH_PX
+                ctx.fillRect(profileX, yTop, barWidth, yBot - yTop)
+            }
+
+            if (showValueArea) {
+                ctx.strokeStyle = VA_COLOR
+                ctx.lineWidth = 1
+                ctx.setLineDash([4, 4])
+                const vahY = toY(vah)
+                const valY = toY(val)
+                ctx.beginPath()
+                ctx.moveTo(scrollLeft, vahY)
+                ctx.lineTo(scrollLeft + context.paneWidth, vahY)
+                ctx.moveTo(scrollLeft, valY)
+                ctx.lineTo(scrollLeft + context.paneWidth, valY)
+                ctx.stroke()
+                ctx.setLineDash([])
+            }
+
+            if (showPOC) {
+                ctx.strokeStyle = POC_COLOR
+                ctx.lineWidth = 1
+                const pocY = toY(poc)
+                ctx.beginPath()
+                ctx.moveTo(scrollLeft, pocY)
+                ctx.lineTo(scrollLeft + context.paneWidth, pocY)
+                ctx.stroke()
+            }
+
+            ctx.restore()
+        },
+        getConfig() {
+            const stateKey = resolveKey()
+            if (!stateKey) return {}
+            const state = pluginHost?.getSharedState<VolumeProfileRenderState>(stateKey)
+            return state?.params ?? {}
+        },
+        setConfig() {},
+    }
+}
+
+@Indicator({
+    name: 'volumeProfile',
+    displayName: 'VP',
+    category: 'volume',
+    stateKey: createVolumeProfileStateKey,
+    defaultPaneId: 'sub_VolumeProfile',
+    paneIdField: 'volumeProfilePaneId',
+    applyResult: (host, state, paneId) => {
+        host.setSharedState(createVolumeProfileStateKey(paneId), state as any, 'indicator_scheduler')
+    },
+})
+class VolumeProfileIndicatorDefinition {
+    static rendererFactory = createVolumeProfileRendererPlugin
+}

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

@@ -0,0 +1,123 @@
+import type { RendererPluginWithHost, RenderContext, PluginHost } from '../../../plugin'
+import { RENDERER_PRIORITY } from '../../../plugin'
+import type { VWAPRenderState } from '../../indicators/vwapState'
+import { createVWAPStateKey } from '../../indicators/vwapState'
+import { Indicator } from '../../indicators/indicatorDefinitionRegistry'
+import { resolveStateKey } from '../../indicators/indicatorMetadata'
+import type { IndicatorScheduler } from '../../indicators/scheduler'
+
+const VWAP_COLOR = '#ec4899'
+
+type LinePoint = { x: number; y: number }
+
+function getVWAPStateKey(host: PluginHost | null, paneId: string): string | null {
+    const scheduler = host?.getService<IndicatorScheduler>('indicatorScheduler')
+    if (!scheduler) {
+        console.warn(`[VWAPRenderer] Scheduler not available via service locator`)
+        return null
+    }
+    const meta = scheduler.getIndicatorMetadata('vwap')
+    if (!meta) {
+        console.warn(`[VWAPRenderer] Indicator metadata for 'vwap' not found, skip rendering`)
+        return null
+    }
+    return resolveStateKey(meta.stateKey, paneId)
+}
+
+export function createVWAPRendererPlugin(options: { paneId?: string } = {}): RendererPluginWithHost {
+    const { paneId = 'sub_VWAP' } = options
+    let pluginHost: PluginHost | null = null
+
+    function resolveKey(): string | null {
+        return getVWAPStateKey(pluginHost, paneId)
+    }
+    return {
+        name: `vwap_${paneId}`,
+        version: '1.1.0',
+        description: 'VWAP 成交量加权均价渲染器（WebGL + Canvas2D 回退）',
+        debugName: 'VWAP',
+        paneId,
+        priority: RENDERER_PRIORITY.MAIN,
+        onInstall(host) { pluginHost = host },
+        getDeclaredNamespaces() { const key = resolveKey(); return key ? [key] : [] },
+        draw(context: RenderContext) {
+            const { ctx, pane, range, scrollLeft, kLineCenters, lineWebGLSurface } = context
+            const stateKey = resolveKey()
+            if (!stateKey) return
+            const state = pluginHost?.getSharedState<VWAPRenderState>(stateKey)
+            if (!state || !state.params.showVWAP || state.visibleMin > state.visibleMax) return
+
+            const { valueMin, valueMax, series } = state
+            const displayRange = pane.yAxis.getDisplayRange({ minPrice: valueMin, maxPrice: valueMax })
+            const displayMin = displayRange.minPrice
+            const displayMax = displayRange.maxPrice
+            const displayValueRange = displayMax - displayMin || 1
+            const paneH = pane.height
+            const invRange = paneH / displayValueRange
+            const rangeStart = range.start
+
+            const drawEnd = Math.min(range.end, series.length)
+            const points: LinePoint[] = []
+            for (let i = range.start; i < drawEnd; i++) {
+                const value = series[i]
+                if (value === undefined) continue
+                const centerX = kLineCenters[i - rangeStart]
+                if (centerX === undefined) continue
+                points.push({ x: centerX, y: paneH - (value - displayMin) * invRange })
+            }
+
+            if (points.length < 2) return
+
+            const enableWebGL = context.settings?.enableWebGLRendering !== false
+            let usedWebGL = false
+            if (enableWebGL && lineWebGLSurface?.isAvailable()) {
+                const allOk = lineWebGLSurface.drawLineStrips(
+                    [{ points, width: 1, color: VWAP_COLOR }],
+                    scrollLeft,
+                )
+                if (allOk) {
+                    usedWebGL = true
+                    lineWebGLSurface.compositeTo(ctx, { imageSmoothingEnabled: false })
+                }
+            }
+
+            if (usedWebGL) return
+
+            ctx.save()
+            ctx.translate(-scrollLeft, 0)
+            ctx.strokeStyle = VWAP_COLOR
+            ctx.lineWidth = 1
+            ctx.lineJoin = 'round'
+            ctx.lineCap = 'round'
+            ctx.beginPath()
+            ctx.moveTo(points[0]!.x, points[0]!.y)
+            for (let i = 1; i < points.length; i++) {
+                ctx.lineTo(points[i]!.x, points[i]!.y)
+            }
+            ctx.stroke()
+            ctx.restore()
+        },
+        getConfig() {
+            const stateKey = resolveKey()
+            if (!stateKey) return {}
+            const state = pluginHost?.getSharedState<VWAPRenderState>(stateKey)
+            return state?.params ?? {}
+        },
+        setConfig() {},
+    }
+}
+
+@Indicator({
+    name: 'vwap',
+    displayName: 'VWAP',
+    category: 'volume',
+    stateKey: createVWAPStateKey,
+    defaultPaneId: 'sub_VWAP',
+    paneIdField: 'vwapPaneId',
+    applyResult: (host, state, paneId) => {
+        host.setSharedState(createVWAPStateKey(paneId), state as any, 'indicator_scheduler')
+    },
+})
+class VWAPIndicatorDefinition {
+    static rendererFactory = createVWAPRendererPlugin
+}

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

@@ -0,0 +1,136 @@
+import type { RendererPluginWithHost, RenderContext, PluginHost } from '../../../plugin'
+import { RENDERER_PRIORITY } from '../../../plugin'
+import type { WMARenderState } from '../../indicators/wmaState'
+import { createWMAStateKey } from '../../indicators/wmaState'
+import { Indicator } from '../../indicators/indicatorDefinitionRegistry'
+import { resolveStateKey } from '../../indicators/indicatorMetadata'
+import type { IndicatorScheduler } from '../../indicators/scheduler'
+
+const WMA_COLOR = '#10b981'
+
+type Point = { x: number; y: number }
+
+export interface WMARendererOptions {
+    paneId?: string
+}
+
+function getWMAStateKey(host: PluginHost | null, paneId: string): string | null {
+    const scheduler = host?.getService<IndicatorScheduler>('indicatorScheduler')
+    if (!scheduler) {
+        console.warn('[WMARenderer] Scheduler not available via service locator')
+        return null
+    }
+    const meta = scheduler.getIndicatorMetadata('wma')
+    if (!meta) {
+        console.warn('[WMARenderer] Indicator metadata for \'wma\' not found, skip rendering')
+        return null
+    }
+    return resolveStateKey(meta.stateKey, paneId)
+}
+
+export function createWMARendererPlugin(options: WMARendererOptions = {}): RendererPluginWithHost {
+    const { paneId = 'main' } = options
+    let pluginHost: PluginHost | null = null
+
+    function resolveKey(): string | null {
+        return getWMAStateKey(pluginHost, paneId)
+    }
+
+    return {
+        name: `wma_${paneId}`,
+        version: '1.1.0',
+        description: 'WMA 线性加权移动均线渲染器（WebGL + Canvas2D 回退）',
+        debugName: 'WMA',
+        paneId,
+        priority: RENDERER_PRIORITY.MAIN,
+
+        onInstall(host: PluginHost) {
+            pluginHost = host
+        },
+
+        getDeclaredNamespaces() {
+            const key = resolveKey()
+            return key ? [key] : []
+        },
+
+        draw(context: RenderContext) {
+            const { ctx, pane, range, scrollLeft, kLineCenters, lineWebGLSurface } = context
+
+            const stateKey = resolveKey()
+            if (!stateKey) return
+            const state = pluginHost?.getSharedState<WMARenderState>(stateKey)
+            if (!state || !state.params.showWMA || state.visibleMin > state.visibleMax) return
+
+            const { series } = state
+            const drawEnd = Math.min(range.end, series.length)
+            const rangeStart = range.start
+
+            const points: Point[] = []
+            for (let i = range.start; i < drawEnd; i++) {
+                const value = series[i]
+                if (value === undefined) continue
+                const centerX = kLineCenters[i - rangeStart]
+                if (centerX === undefined) continue
+                points.push({ x: centerX, y: pane.yAxis.priceToY(value) })
+            }
+
+            if (points.length < 2) return
+
+            const enableWebGL = context.settings?.enableWebGLRendering !== false
+            let usedWebGL = false
+            if (enableWebGL && lineWebGLSurface?.isAvailable()) {
+                const allOk = lineWebGLSurface.drawLineStrips(
+                    [{ points, width: 1, color: WMA_COLOR }],
+                    scrollLeft,
+                )
+                if (allOk) {
+                    usedWebGL = true
+                    lineWebGLSurface.compositeTo(ctx, { imageSmoothingEnabled: false })
+                }
+            }
+
+            if (usedWebGL) return
+
+            ctx.save()
+            ctx.translate(-scrollLeft, 0)
+            ctx.strokeStyle = WMA_COLOR
+            ctx.lineWidth = 1
+            ctx.lineJoin = 'round'
+            ctx.lineCap = 'round'
+            ctx.beginPath()
+            ctx.moveTo(points[0]!.x, points[0]!.y)
+            for (let i = 1; i < points.length; i++) {
+                ctx.lineTo(points[i]!.x, points[i]!.y)
+            }
+            ctx.stroke()
+            ctx.restore()
+        },
+
+        getConfig() {
+            const stateKey = resolveKey()
+            if (!stateKey) return {}
+            const state = pluginHost?.getSharedState<WMARenderState>(stateKey)
+            return state?.params ?? {}
+        },
+
+        setConfig() {
+            // no-op
+        },
+    }
+}
+
+@Indicator({
+    name: 'wma',
+    displayName: 'WMA',
+    category: 'main',
+    stateKey: createWMAStateKey,
+    defaultPaneId: 'main',
+    paneIdField: 'wmaPaneId',
+    allowMainPane: true,
+    applyResult: (host, state, paneId) => {
+        host.setSharedState(createWMAStateKey(paneId), state as any, 'indicator_scheduler')
+    },
+})
+class WMADefinition {
+    static rendererFactory = createWMARendererPlugin
+}