@363045841yyt/klinechart-core 0.7.3

package/src/engine/scale/priceScale.ts

@@ -0,0 +1,264 @@
+import type { PriceRange } from './price'
+import type { ScaleType } from '../utils/tickPosition'
+import {
+    type LogFormula,
+    toLog,
+    fromLog,
+    logFormulaForPriceRange,
+    logFormulasAreSame,
+} from './logFormula'
+
+/**
+ * Pane 级别的价格坐标系（价格 -> pane 内 Y）
+ * - y=0 在 pane 顶部，y=height 在 pane 底部
+ */
+export class PriceScale {
+    private range: PriceRange = { maxPrice: 100, minPrice: 0 }
+    private height = 1
+    private paddingTop = 0
+    private paddingBottom = 0
+
+    /** 价格偏移量（用于上下拖动平移价格轴）
+     * 在对数模式下，此偏移量为 log 空间偏移 */
+    private priceOffset = 0
+
+    /** 垂直缩放系数（1=默认，>1 放大，<1 缩小） */
+    private verticalScale = 1
+
+    /** 刻度类型：线性或对数 */
+    private scaleType: ScaleType = 'linear'
+
+    /** 对数变换公式（动态计算，适配极小价格） */
+    private logFormula: LogFormula = logFormulaForPriceRange(null)
+
+    setRange(r: PriceRange) {
+        this.range = r
+        if (this.scaleType === 'log' && r.minPrice > 0) {
+            const newFormula = logFormulaForPriceRange(r)
+            if (!logFormulasAreSame(newFormula, this.logFormula)) {
+                // 将旧公式的 log 偏移量转换到新公式空间
+                const oldLogMin = toLog(r.minPrice, this.logFormula)
+                const oldLogMax = toLog(r.maxPrice, this.logFormula)
+                const oldCenter = (oldLogMax + oldLogMin) / 2 + this.priceOffset
+
+                this.logFormula = newFormula
+
+                const newLogMin = toLog(r.minPrice, this.logFormula)
+                const newLogMax = toLog(r.maxPrice, this.logFormula)
+                const newBaseCenter = (newLogMax + newLogMin) / 2
+                this.priceOffset = this.clampOffset(oldCenter - newBaseCenter)
+            }
+        }
+    }
+
+    setHeight(h: number) {
+        this.height = Math.max(1, h)
+    }
+
+    setPadding(top: number, bottom: number) {
+        this.paddingTop = Math.max(0, top)
+        this.paddingBottom = Math.max(0, bottom)
+    }
+
+    getRange(): PriceRange {
+        return this.range
+    }
+
+    getPaddingTop(): number {
+        return this.paddingTop
+    }
+
+    getPaddingBottom(): number {
+        return this.paddingBottom
+    }
+
+    /**
+     * 设置价格偏移量
+     * @param offset 价格偏移
+     *   - 线性模式：真实价格的线性偏移
+     *   - 对数模式：log 空间的偏移量
+     */
+    setPriceOffset(offset: number): void {
+        this.priceOffset = this.clampOffset(offset)
+    }
+
+    /**
+     * 获取当前价格偏移量
+     */
+    getPriceOffset(): number {
+        return this.priceOffset
+    }
+
+    /**
+     * 重置价格偏移量
+     */
+    resetPriceOffset(): void {
+        this.priceOffset = 0
+    }
+
+    /**
+     * 根据当前 range 和 verticalScale 对 priceOffset 进行 clamp，
+     * 防止视口完全离开数据范围。
+     */
+    private clampOffset(offset: number): number {
+        if (this.scaleType === 'log' && this.range.minPrice > 0) {
+            const logMin = toLog(this.range.minPrice, this.logFormula)
+            const logMax = toLog(this.range.maxPrice, this.logFormula)
+            const logRange = logMax - logMin
+            if (logRange <= 0) return 0
+            const maxOffset = logRange * (1 + 1 / this.verticalScale) / 2
+            return Math.max(-maxOffset, Math.min(maxOffset, offset))
+        }
+
+        const rangeSize = this.range.maxPrice - this.range.minPrice
+        if (rangeSize <= 0) return 0
+        const maxOffset = rangeSize * (1 + 1 / this.verticalScale) / 2
+        return Math.max(-maxOffset, Math.min(maxOffset, offset))
+    }
+
+    /**
+     * 按拖拽位移缩放 Y 轴（deltaY < 0 放大，deltaY > 0 缩小）
+     */
+    scaleByDelta(deltaY: number): void {
+        if (!Number.isFinite(deltaY) || deltaY === 0) return
+        const factor = Math.exp(-deltaY * 0.01)
+        const nextScale = this.verticalScale * factor
+        this.verticalScale = Math.min(8, Math.max(0.2, nextScale))
+        this.priceOffset = this.clampOffset(this.priceOffset)
+    }
+
+    getVerticalScale(): number {
+        return this.verticalScale
+    }
+
+    /**
+     * 设置刻度类型
+     * 切换时会自动转换 priceOffset 以保持视口位置
+     */
+    setScaleType(type: ScaleType): void {
+        if (type === this.scaleType) return
+
+        if (type === 'log' && this.range.minPrice > 0) {
+            // 线性 → 对数：把线性偏移转为 log 空间偏移
+            this.logFormula = logFormulaForPriceRange(this.range)
+            const baseCenter = (this.range.maxPrice + this.range.minPrice) / 2
+            const realCenter = baseCenter + this.priceOffset
+            this.priceOffset = toLog(realCenter, this.logFormula) - toLog(baseCenter, this.logFormula)
+            this.priceOffset = this.clampOffset(this.priceOffset)
+        } else if (type === 'linear' && this.scaleType === 'log') {
+            // 对数 → 线性：把 log 空间偏移转为线性偏移
+            const logMin = toLog(this.range.minPrice, this.logFormula)
+            const logMax = toLog(this.range.maxPrice, this.logFormula)
+            const logCenter = (logMax + logMin) / 2 + this.priceOffset
+            const realCenter = fromLog(logCenter, this.logFormula)
+            const baseCenter = (this.range.maxPrice + this.range.minPrice) / 2
+            this.priceOffset = realCenter - baseCenter
+            this.priceOffset = this.clampOffset(this.priceOffset)
+        }
+
+        this.scaleType = type
+    }
+
+    /**
+     * 获取当前刻度类型
+     */
+    getScaleType(): ScaleType {
+        return this.scaleType
+    }
+
+    /**
+     * 获取显示范围（考虑 priceOffset 和 verticalScale）
+     *
+     * 对数模式下：
+     * - 内部计算在 log 空间进行
+     * - 返回的价格为真实价格
+     */
+    getDisplayRange(baseRange?: PriceRange): PriceRange {
+        const src = baseRange ?? this.range
+        const { minPrice, maxPrice } = src
+
+        // 对数模式：在 log 空间计算
+        if (this.scaleType === 'log' && minPrice > 0) {
+            const logMin = toLog(minPrice, this.logFormula)
+            const logMax = toLog(maxPrice, this.logFormula)
+            const logRange = logMax - logMin || 1
+            const logCenter = (logMax + logMin) / 2 + this.priceOffset
+            const logHalfRange = logRange / (2 * this.verticalScale)
+            return {
+                maxPrice: fromLog(logCenter + logHalfRange, this.logFormula),
+                minPrice: fromLog(logCenter - logHalfRange, this.logFormula),
+            }
+        }
+
+        // 线性模式：原逻辑不变
+        const baseRangeSize = maxPrice - minPrice || 1
+        const centerPrice = (maxPrice + minPrice) / 2 + this.priceOffset
+        const halfRange = baseRangeSize / (2 * this.verticalScale)
+        return {
+            maxPrice: centerPrice + halfRange,
+            minPrice: centerPrice - halfRange,
+        }
+    }
+
+    /**
+     * 价格 → Y 坐标
+     * 统一使用 getDisplayRange 的结果进行映射
+     */
+    priceToY(price: number): number {
+        const { maxPrice, minPrice } = this.getDisplayRange()
+        const viewHeight = Math.max(1, this.height - this.paddingTop - this.paddingBottom)
+
+        let ratio: number
+        if (this.scaleType === 'log' && minPrice > 0) {
+            const logMin = toLog(minPrice, this.logFormula)
+            const logMax = toLog(maxPrice, this.logFormula)
+            const logPrice = toLog(price, this.logFormula)
+            ratio = (logPrice - logMin) / (logMax - logMin || 1)
+        } else {
+            ratio = (price - minPrice) / (maxPrice - minPrice || 1)
+        }
+
+        // 注意：ratio = 0 对应 minPrice（底部），ratio = 1 对应 maxPrice（顶部）
+        // 但在屏幕上，y=0 是顶部，y=height 是底部
+        return this.paddingTop + viewHeight * (1 - ratio)
+    }
+
+    /**
+     * Y 坐标 → 价格
+     * 统一使用 getDisplayRange 的结果进行映射
+     */
+    yToPrice(y: number): number {
+        const { maxPrice, minPrice } = this.getDisplayRange()
+        const viewHeight = Math.max(1, this.height - this.paddingTop - this.paddingBottom)
+        const ratio = 1 - (y - this.paddingTop) / viewHeight
+
+        if (this.scaleType === 'log' && minPrice > 0) {
+            const logMin = toLog(minPrice, this.logFormula)
+            const logMax = toLog(maxPrice, this.logFormula)
+            const logPrice = logMin + ratio * (logMax - logMin)
+            return fromLog(logPrice, this.logFormula)
+        }
+
+        return minPrice + ratio * (maxPrice - minPrice)
+    }
+
+    /**
+     * 根据像素偏移计算价格偏移
+     * @param deltaY Y轴像素偏移（正数向下拖动）
+     * @returns 对应的价格偏移量
+     *   - 线性模式：真实价格的偏移
+     *   - 对数模式：log 空间的偏移
+     */
+    deltaYToPriceOffset(deltaY: number): number {
+        const viewHeight = Math.max(1, this.height - this.paddingTop - this.paddingBottom)
+
+        if (this.scaleType === 'log' && this.range.minPrice > 0) {
+            const logMin = toLog(this.range.minPrice, this.logFormula)
+            const logMax = toLog(this.range.maxPrice, this.logFormula)
+            return deltaY * ((logMax - logMin) / viewHeight)
+        }
+
+        const range = this.range.maxPrice - this.range.minPrice || 1
+        return deltaY * (range / viewHeight)
+    }
+}

package/src/engine/subPaneManager.ts

@@ -0,0 +1,427 @@
+import type { Chart } from './chart'
+import type { SubIndicatorType } from './renderers/Indicator'
+import { createSubIndicatorRenderer } from './renderers/Indicator'
+import { createVolumeScaleRendererPlugin } from './renderers/Indicator/scale/volume_scale'
+import { createMacdScaleRendererPlugin } from './renderers/Indicator/scale/macd_scale'
+import { createRsiScaleRendererPlugin } from './renderers/Indicator/scale/rsi_scale'
+import { createCciScaleRendererPlugin } from './renderers/Indicator/scale/cci_scale'
+import { createStochScaleRendererPlugin } from './renderers/Indicator/scale/stoch_scale'
+import { createMomScaleRendererPlugin } from './renderers/Indicator/scale/mom_scale'
+import { createWmsrScaleRendererPlugin } from './renderers/Indicator/scale/wmsr_scale'
+import { createKstScaleRendererPlugin } from './renderers/Indicator/scale/kst_scale'
+import { createFastkScaleRendererPlugin } from './renderers/Indicator/scale/fastk_scale'
+import { createAtrScaleRendererPlugin } from './renderers/Indicator/scale/atr_scale'
+import { createIndicatorScaleRendererPlugin } from './renderers/Indicator/scale/indicator_scale'
+import type {
+    RSISchedulerConfig,
+    CCISchedulerConfig,
+    STOCHSchedulerConfig,
+    MOMSchedulerConfig,
+    WMSRSchedulerConfig,
+    KSTSchedulerConfig,
+    FASTKSchedulerConfig,
+    ATRSchedulerConfig,
+    WMASchedulerConfig,
+    DEMASchedulerConfig,
+    TEMASchedulerConfig,
+    HMASchedulerConfig,
+    KAMASchedulerConfig,
+    SARSchedulerConfig,
+    SuperTrendSchedulerConfig,
+    KeltnerSchedulerConfig,
+    DonchianSchedulerConfig,
+    IchimokuSchedulerConfig,
+    ROCSchedulerConfig,
+    TRIXSchedulerConfig,
+    HVSchedulerConfig,
+    ParkinsonSchedulerConfig,
+    ChaikinVolSchedulerConfig,
+    VMASchedulerConfig,
+    OBVSchedulerConfig,
+    PVTSchedulerConfig,
+    VWAPSchedulerConfig,
+    CMFSchedulerConfig,
+    MFISchedulerConfig,
+    PivotSchedulerConfig,
+    FibSchedulerConfig,
+    StructureSchedulerConfig,
+    ZonesSchedulerConfig,
+    VolumeProfileSchedulerConfig,
+} from './indicators/scheduler'
+import type { MACDSchedulerConfig } from './indicators/macdState'
+
+export interface SubPaneEntry {
+    paneId: string
+    indicatorId: SubIndicatorType
+    params: Record<string, unknown>
+    rendererName: string
+    scaleRendererName: string
+}
+
+export class SubPaneManager {
+    private entries = new Map<string, SubPaneEntry>()
+
+    create(chart: Chart, paneId: string, indicatorId: SubIndicatorType, params: Record<string, unknown>): boolean {
+        if (this.entries.has(paneId)) {
+            return true
+        }
+
+        const rendererName = `${indicatorId.toLowerCase()}_${paneId}`
+        const scaleRendererName = `${indicatorId.toLowerCase()}_scale_${paneId}`
+
+        const paneExists = chart.hasPane(paneId)
+        if (!paneExists) {
+            chart.upsertPane({ id: paneId, ratio: 1, visible: true, role: 'indicator' })
+        }
+
+        const existingRenderer = chart.getRenderer(rendererName)
+        if (!existingRenderer) {
+            const renderer = createSubIndicatorRenderer({ indicatorId, paneId })
+            chart.useRenderer(renderer, params as Record<string, number | boolean | string>)
+        }
+
+        this.mountScaleRenderer(chart, paneId, indicatorId, scaleRendererName)
+
+        // 必须在 syncSchedulerConfig 之前注册 entry，
+        // 否则 scheduler 的 buildActiveConfig 读不到新 paneId，会将新指标的 show* 标志置为 false
+        this.entries.set(paneId, { paneId, indicatorId, params, rendererName, scaleRendererName })
+
+        this.syncSchedulerConfig(chart, paneId, indicatorId, params)
+
+        chart.getIndicatorScheduler().onSubPaneChanged()
+
+        return true
+    }
+
+    remove(chart: Chart, paneId: string): void {
+        const entry = this.entries.get(paneId)
+        if (!entry) return
+
+        chart.removeRenderer(entry.rendererName)
+        chart.removeRenderer(entry.scaleRendererName)
+
+        this.entries.delete(paneId)
+
+        if (chart.hasPane(paneId)) {
+            chart.removePaneDefinition(paneId)
+        }
+
+        chart.getIndicatorScheduler().onSubPaneChanged()
+    }
+
+    replaceIndicator(chart: Chart, paneId: string, newIndicatorId: SubIndicatorType, newParams: Record<string, unknown>): void {
+        const entry = this.entries.get(paneId)
+        if (!entry) return
+
+        const oldIndicatorId = entry.indicatorId
+
+        chart.removeRenderer(entry.rendererName)
+        chart.removeRenderer(entry.scaleRendererName)
+
+        const newRendererName = `${newIndicatorId.toLowerCase()}_${paneId}`
+        const newScaleRendererName = `${newIndicatorId.toLowerCase()}_scale_${paneId}`
+
+        const renderer = createSubIndicatorRenderer({ indicatorId: newIndicatorId, paneId })
+        chart.useRenderer(renderer, newParams as Record<string, number | boolean | string>)
+
+        this.mountScaleRenderer(chart, paneId, newIndicatorId, newScaleRendererName)
+
+        this.syncSchedulerConfig(chart, paneId, newIndicatorId, newParams)
+
+        this.entries.set(paneId, {
+            paneId,
+            indicatorId: newIndicatorId,
+            params: newParams,
+            rendererName: newRendererName,
+            scaleRendererName: newScaleRendererName,
+        })
+
+        chart.getIndicatorScheduler().onSubPaneChanged()
+    }
+
+    updateParams(chart: Chart, paneId: string, params: Record<string, unknown>): void {
+        const entry = this.entries.get(paneId)
+        if (!entry) return
+
+        entry.params = { ...params }
+
+        chart.updateRendererConfig(entry.rendererName, params)
+
+        this.syncSchedulerConfig(chart, paneId, entry.indicatorId, entry.params)
+    }
+
+    getByPaneId(paneId: string): SubPaneEntry | undefined {
+        return this.entries.get(paneId)
+    }
+
+    getAll(): SubPaneEntry[] {
+        return Array.from(this.entries.values())
+    }
+
+    getPaneIds(): string[] {
+        return Array.from(this.entries.keys())
+    }
+
+    clear(chart: Chart): void {
+        for (const entry of this.entries.values()) {
+            chart.removeRenderer(entry.rendererName)
+            chart.removeRenderer(entry.scaleRendererName)
+        }
+        this.entries.clear()
+        chart.getIndicatorScheduler().onSubPaneChanged()
+    }
+
+    private syncSchedulerConfig(
+        chart: Chart,
+        paneId: string,
+        indicatorId: SubIndicatorType,
+        params: Record<string, unknown>,
+    ): void {
+        const scheduler = chart.getIndicatorScheduler()
+        switch (indicatorId) {
+            case 'MACD':
+                scheduler.updateMACDConfig(params as Partial<MACDSchedulerConfig>, paneId)
+                break
+            case 'RSI':
+                scheduler.updateRSIConfig(params as Partial<RSISchedulerConfig>, paneId)
+                break
+            case 'CCI':
+                scheduler.updateCCIConfig(params as Partial<CCISchedulerConfig>, paneId)
+                break
+            case 'STOCH':
+                scheduler.updateSTOCHConfig(params as Partial<STOCHSchedulerConfig>, paneId)
+                break
+            case 'MOM':
+                scheduler.updateMOMConfig(params as Partial<MOMSchedulerConfig>, paneId)
+                break
+            case 'WMSR':
+                scheduler.updateWMSRConfig(params as Partial<WMSRSchedulerConfig>, paneId)
+                break
+            case 'KST':
+                scheduler.updateKSTConfig(params as Partial<KSTSchedulerConfig>, paneId)
+                break
+            case 'FASTK':
+                scheduler.updateFASTKConfig(params as Partial<FASTKSchedulerConfig>, paneId)
+                break
+            case 'ATR':
+                console.log(`[ATR-SubPane] syncSchedulerConfig: paneId=${paneId} params=${JSON.stringify(params)}`)
+                scheduler.updateATRConfig(params as Partial<ATRSchedulerConfig>, paneId)
+                break
+            case 'WMA':
+                scheduler.updateWMAConfig(params as Partial<WMASchedulerConfig>, paneId)
+                break
+            case 'DEMA':
+                scheduler.updateDEMAConfig(params as Partial<DEMASchedulerConfig>, paneId)
+                break
+            case 'TEMA':
+                scheduler.updateTEMAConfig(params as Partial<TEMASchedulerConfig>, paneId)
+                break
+            case 'HMA':
+                scheduler.updateHMAConfig(params as Partial<HMASchedulerConfig>, paneId)
+                break
+            case 'KAMA':
+                scheduler.updateKAMAConfig(params as Partial<KAMASchedulerConfig>, paneId)
+                break
+            case 'SAR':
+                scheduler.updateSARConfig(params as Partial<SARSchedulerConfig>, paneId)
+                break
+            case 'SUPERTREND':
+                scheduler.updateSuperTrendConfig(params as Partial<SuperTrendSchedulerConfig>, paneId)
+                break
+            case 'KELTNER':
+                scheduler.updateKeltnerConfig(params as Partial<KeltnerSchedulerConfig>, paneId)
+                break
+            case 'DONCHIAN':
+                scheduler.updateDonchianConfig(params as Partial<DonchianSchedulerConfig>, paneId)
+                break
+            case 'ICHIMOKU':
+                scheduler.updateIchimokuConfig(params as Partial<IchimokuSchedulerConfig>, paneId)
+                break
+            case 'ROC':
+                scheduler.updateROCConfig(params as Partial<ROCSchedulerConfig>, paneId)
+                break
+            case 'TRIX':
+                scheduler.updateTRIXConfig(params as Partial<TRIXSchedulerConfig>, paneId)
+                break
+            case 'HV':
+                scheduler.updateHVConfig(params as Partial<HVSchedulerConfig>, paneId)
+                break
+            case 'PARKINSON':
+                scheduler.updateParkinsonConfig(params as Partial<ParkinsonSchedulerConfig>, paneId)
+                break
+            case 'CHAIKIN_VOL':
+                scheduler.updateChaikinVolConfig(params as Partial<ChaikinVolSchedulerConfig>, paneId)
+                break
+            case 'VMA':
+                scheduler.updateVMAConfig(params as Partial<VMASchedulerConfig>, paneId)
+                break
+            case 'OBV':
+                scheduler.updateOBVConfig(params as Partial<OBVSchedulerConfig>, paneId)
+                break
+            case 'PVT':
+                scheduler.updatePVTConfig(params as Partial<PVTSchedulerConfig>, paneId)
+                break
+            case 'VWAP':
+                scheduler.updateVWAPConfig(params as Partial<VWAPSchedulerConfig>, paneId)
+                break
+            case 'CMF':
+                scheduler.updateCMFConfig(params as Partial<CMFSchedulerConfig>, paneId)
+                break
+            case 'MFI':
+                scheduler.updateMFIConfig(params as Partial<MFISchedulerConfig>, paneId)
+                break
+            case 'PIVOT':
+                scheduler.updatePivotConfig(params as Partial<PivotSchedulerConfig>, paneId)
+                break
+            case 'FIB':
+                scheduler.updateFibConfig(params as Partial<FibSchedulerConfig>, paneId)
+                break
+            case 'STRUCTURE':
+                scheduler.updateStructureConfig(params as Partial<StructureSchedulerConfig>, paneId)
+                break
+            case 'ZONES':
+                scheduler.updateZonesConfig(params as Partial<ZonesSchedulerConfig>, paneId)
+                break
+            case 'VOLUME_PROFILE':
+                scheduler.updateVolumeProfileConfig(params as Partial<VolumeProfileSchedulerConfig>, paneId)
+                break
+            case 'VOLUME':
+                break
+        }
+    }
+
+    private mountScaleRenderer(chart: Chart, paneId: string, indicatorId: SubIndicatorType, scaleRendererName: string): void {
+        const existing = chart.getRenderer(scaleRendererName)
+        if (existing) return
+
+        const axisWidth = chart.getOption().rightAxisWidth + (chart.getOption().priceLabelWidth ?? 60)
+        const yPaddingPx = chart.getOption().yPaddingPx
+        const getCrosshair = () => {
+            const pos = chart.interaction.crosshairPos
+            const price = chart.interaction.crosshairPrice
+            const activePaneId = chart.interaction.activePaneId
+            if (pos && price !== null) {
+                return { y: pos.y, price, activePaneId }
+            }
+            return null
+        }
+
+        const opts = { axisWidth, paneId, yPaddingPx, getCrosshair }
+
+        let renderer: import('../plugin').RendererPluginWithHost
+        switch (indicatorId) {
+            case 'VOLUME':
+                renderer = createVolumeScaleRendererPlugin(opts)
+                break
+            case 'MACD':
+                renderer = createMacdScaleRendererPlugin(opts)
+                break
+            case 'RSI':
+                renderer = createRsiScaleRendererPlugin(opts)
+                break
+            case 'CCI':
+                renderer = createCciScaleRendererPlugin(opts)
+                break
+            case 'STOCH':
+                renderer = createStochScaleRendererPlugin(opts)
+                break
+            case 'MOM':
+                renderer = createMomScaleRendererPlugin(opts)
+                break
+            case 'WMSR':
+                renderer = createWmsrScaleRendererPlugin(opts)
+                break
+            case 'KST':
+                renderer = createKstScaleRendererPlugin(opts)
+                break
+            case 'FASTK':
+                renderer = createFastkScaleRendererPlugin(opts)
+                break
+            case 'ATR':
+                renderer = createAtrScaleRendererPlugin(opts)
+                break
+            case 'WMA':
+                renderer = createIndicatorScaleRendererPlugin({ ...opts, indicatorKey: 'wma', label: 'WMA', decimals: 2 })
+                break
+            case 'DEMA':
+                renderer = createIndicatorScaleRendererPlugin({ ...opts, indicatorKey: 'dema', label: 'DEMA', decimals: 2 })
+                break
+            case 'TEMA':
+                renderer = createIndicatorScaleRendererPlugin({ ...opts, indicatorKey: 'tema', label: 'TEMA', decimals: 2 })
+                break
+            case 'HMA':
+                renderer = createIndicatorScaleRendererPlugin({ ...opts, indicatorKey: 'hma', label: 'HMA', decimals: 2 })
+                break
+            case 'KAMA':
+                renderer = createIndicatorScaleRendererPlugin({ ...opts, indicatorKey: 'kama', label: 'KAMA', decimals: 2 })
+                break
+            case 'SAR':
+                renderer = createIndicatorScaleRendererPlugin({ ...opts, indicatorKey: 'sar', label: 'SAR', decimals: 4 })
+                break
+            case 'SUPERTREND':
+                renderer = createIndicatorScaleRendererPlugin({ ...opts, indicatorKey: 'supertrend', label: 'SuperTrend', decimals: 2 })
+                break
+            case 'KELTNER':
+                renderer = createIndicatorScaleRendererPlugin({ ...opts, indicatorKey: 'keltner', label: 'Keltner', decimals: 2 })
+                break
+            case 'DONCHIAN':
+                renderer = createIndicatorScaleRendererPlugin({ ...opts, indicatorKey: 'donchian', label: 'Donchian', decimals: 2 })
+                break
+            case 'ICHIMOKU':
+                renderer = createIndicatorScaleRendererPlugin({ ...opts, indicatorKey: 'ichimoku', label: 'Ichimoku', decimals: 2 })
+                break
+            case 'ROC':
+                renderer = createIndicatorScaleRendererPlugin({ ...opts, indicatorKey: 'roc', label: 'ROC', decimals: 2 })
+                break
+            case 'TRIX':
+                renderer = createIndicatorScaleRendererPlugin({ ...opts, indicatorKey: 'trix', label: 'TRIX', decimals: 6 })
+                break
+            case 'HV':
+                renderer = createIndicatorScaleRendererPlugin({ ...opts, indicatorKey: 'hv', label: 'HV', decimals: 2 })
+                break
+            case 'PARKINSON':
+                renderer = createIndicatorScaleRendererPlugin({ ...opts, indicatorKey: 'parkinson', label: 'Parkinson', decimals: 2 })
+                break
+            case 'CHAIKIN_VOL':
+                renderer = createIndicatorScaleRendererPlugin({ ...opts, indicatorKey: 'chaikinVol', label: 'ChaikinVol', decimals: 2 })
+                break
+            case 'VMA':
+                renderer = createIndicatorScaleRendererPlugin({ ...opts, indicatorKey: 'vma', label: 'VMA', decimals: 0 })
+                break
+            case 'OBV':
+                renderer = createIndicatorScaleRendererPlugin({ ...opts, indicatorKey: 'obv', label: 'OBV', decimals: 0 })
+                break
+            case 'PVT':
+                renderer = createIndicatorScaleRendererPlugin({ ...opts, indicatorKey: 'pvt', label: 'PVT', decimals: 0 })
+                break
+            case 'VWAP':
+                renderer = createIndicatorScaleRendererPlugin({ ...opts, indicatorKey: 'vwap', label: 'VWAP', decimals: 2 })
+                break
+            case 'CMF':
+                renderer = createIndicatorScaleRendererPlugin({ ...opts, indicatorKey: 'cmf', label: 'CMF', decimals: 4 })
+                break
+            case 'MFI':
+                renderer = createIndicatorScaleRendererPlugin({ ...opts, indicatorKey: 'mfi', label: 'MFI', decimals: 2 })
+                break
+            case 'PIVOT':
+                renderer = createIndicatorScaleRendererPlugin({ ...opts, indicatorKey: 'pivot', label: 'Pivot', decimals: 2 })
+                break
+            case 'FIB':
+                renderer = createIndicatorScaleRendererPlugin({ ...opts, indicatorKey: 'fib', label: 'Fib', decimals: 4 })
+                break
+            case 'STRUCTURE':
+                renderer = createIndicatorScaleRendererPlugin({ ...opts, indicatorKey: 'structure', label: 'Structure', decimals: 2 })
+                break
+            case 'ZONES':
+                renderer = createIndicatorScaleRendererPlugin({ ...opts, indicatorKey: 'zones', label: 'Zones', decimals: 2 })
+                break
+            case 'VOLUME_PROFILE':
+                renderer = createIndicatorScaleRendererPlugin({ ...opts, indicatorKey: 'volumeProfile', label: 'VP', decimals: 0 })
+                break
+            default:
+                return
+        }
+
+        chart.useRenderer(renderer)
+    }
+}