@363045841yyt/klinechart-core 0.7.5 → 0.7.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +8 -8
- package/README.zh-CN.md +8 -8
- package/dist/config/chartSettings.d.ts +27 -2
- package/dist/config/chartSettings.d.ts.map +1 -1
- package/dist/config/chartSettings.js +6 -0
- package/dist/config/chartSettings.js.map +1 -1
- package/dist/controllers/createChartController.d.ts.map +1 -1
- package/dist/controllers/createChartController.js +145 -21
- package/dist/controllers/createChartController.js.map +1 -1
- package/dist/controllers/index.d.ts +9 -1
- package/dist/controllers/index.d.ts.map +1 -1
- package/dist/controllers/index.js +9 -0
- package/dist/controllers/index.js.map +1 -1
- package/dist/controllers/types.d.ts +65 -8
- package/dist/controllers/types.d.ts.map +1 -1
- package/dist/engine/chart.d.ts +2 -12
- package/dist/engine/chart.d.ts.map +1 -1
- package/dist/engine/chart.js +32 -31
- package/dist/engine/chart.js.map +1 -1
- package/dist/engine/controller/interaction.d.ts +1 -1
- package/dist/engine/controller/interaction.d.ts.map +1 -1
- package/dist/engine/controller/interaction.js +10 -2
- package/dist/engine/controller/interaction.js.map +1 -1
- package/dist/engine/draw/pixelAlign.d.ts.map +1 -1
- package/dist/engine/draw/pixelAlign.js.map +1 -1
- package/dist/engine/drawing/interaction.d.ts +3 -3
- package/dist/engine/drawing/interaction.d.ts.map +1 -1
- package/dist/engine/drawing/interaction.js +38 -46
- package/dist/engine/drawing/interaction.js.map +1 -1
- package/dist/engine/drawing/plugin.js +1 -1
- package/dist/engine/drawing/plugin.js.map +1 -1
- package/dist/engine/renderers/Indicator/atr.d.ts.map +1 -1
- package/dist/engine/renderers/Indicator/atr.js +7 -4
- package/dist/engine/renderers/Indicator/atr.js.map +1 -1
- package/dist/engine/renderers/Indicator/boll.js +12 -12
- package/dist/engine/renderers/Indicator/boll.js.map +1 -1
- package/dist/engine/renderers/Indicator/cci.d.ts +1 -2
- package/dist/engine/renderers/Indicator/cci.d.ts.map +1 -1
- package/dist/engine/renderers/Indicator/cci.js +9 -9
- package/dist/engine/renderers/Indicator/cci.js.map +1 -1
- package/dist/engine/renderers/Indicator/ene.js +12 -12
- package/dist/engine/renderers/Indicator/ene.js.map +1 -1
- package/dist/engine/renderers/Indicator/expma.js +6 -6
- package/dist/engine/renderers/Indicator/expma.js.map +1 -1
- package/dist/engine/renderers/Indicator/fastk.d.ts +1 -2
- package/dist/engine/renderers/Indicator/fastk.d.ts.map +1 -1
- package/dist/engine/renderers/Indicator/fastk.js +7 -7
- package/dist/engine/renderers/Indicator/fastk.js.map +1 -1
- package/dist/engine/renderers/Indicator/kst.d.ts +1 -2
- package/dist/engine/renderers/Indicator/kst.d.ts.map +1 -1
- package/dist/engine/renderers/Indicator/kst.js +10 -10
- package/dist/engine/renderers/Indicator/kst.js.map +1 -1
- package/dist/engine/renderers/Indicator/ma.js +5 -5
- package/dist/engine/renderers/Indicator/ma.js.map +1 -1
- package/dist/engine/renderers/Indicator/macd.d.ts +1 -2
- package/dist/engine/renderers/Indicator/macd.d.ts.map +1 -1
- package/dist/engine/renderers/Indicator/macd.js +24 -24
- package/dist/engine/renderers/Indicator/macd.js.map +1 -1
- package/dist/engine/renderers/Indicator/macdLegend.js +6 -6
- package/dist/engine/renderers/Indicator/macdLegend.js.map +1 -1
- package/dist/engine/renderers/Indicator/mainIndicatorLegend.js +16 -16
- package/dist/engine/renderers/Indicator/mainIndicatorLegend.js.map +1 -1
- package/dist/engine/renderers/Indicator/mom.d.ts +1 -2
- package/dist/engine/renderers/Indicator/mom.d.ts.map +1 -1
- package/dist/engine/renderers/Indicator/mom.js +8 -8
- package/dist/engine/renderers/Indicator/mom.js.map +1 -1
- package/dist/engine/renderers/Indicator/rsi.d.ts +2 -3
- package/dist/engine/renderers/Indicator/rsi.d.ts.map +1 -1
- package/dist/engine/renderers/Indicator/rsi.js +15 -15
- package/dist/engine/renderers/Indicator/rsi.js.map +1 -1
- package/dist/engine/renderers/Indicator/scale/indicator_scale.d.ts +1 -2
- package/dist/engine/renderers/Indicator/scale/indicator_scale.d.ts.map +1 -1
- package/dist/engine/renderers/Indicator/scale/indicator_scale.js +5 -5
- package/dist/engine/renderers/Indicator/scale/indicator_scale.js.map +1 -1
- package/dist/engine/renderers/Indicator/stoch.d.ts +1 -2
- package/dist/engine/renderers/Indicator/stoch.d.ts.map +1 -1
- package/dist/engine/renderers/Indicator/stoch.js +10 -10
- package/dist/engine/renderers/Indicator/stoch.js.map +1 -1
- package/dist/engine/renderers/Indicator/structure.js +5 -5
- package/dist/engine/renderers/Indicator/structure.js.map +1 -1
- package/dist/engine/renderers/Indicator/wmsr.d.ts +1 -2
- package/dist/engine/renderers/Indicator/wmsr.d.ts.map +1 -1
- package/dist/engine/renderers/Indicator/wmsr.js +10 -10
- package/dist/engine/renderers/Indicator/wmsr.js.map +1 -1
- package/dist/engine/renderers/Indicator/zones.js +6 -6
- package/dist/engine/renderers/Indicator/zones.js.map +1 -1
- package/dist/engine/renderers/candle.d.ts +1 -1
- package/dist/engine/renderers/candle.d.ts.map +1 -1
- package/dist/engine/renderers/candle.js +21 -21
- package/dist/engine/renderers/candle.js.map +1 -1
- package/dist/engine/renderers/crosshair.js +3 -3
- package/dist/engine/renderers/crosshair.js.map +1 -1
- package/dist/engine/renderers/extremaMarkers.d.ts.map +1 -1
- package/dist/engine/renderers/extremaMarkers.js +12 -12
- package/dist/engine/renderers/extremaMarkers.js.map +1 -1
- package/dist/engine/renderers/gridLines.js +3 -3
- package/dist/engine/renderers/gridLines.js.map +1 -1
- package/dist/engine/renderers/lastPrice.js +7 -7
- package/dist/engine/renderers/lastPrice.js.map +1 -1
- package/dist/engine/renderers/paneTitle.d.ts +5 -24
- package/dist/engine/renderers/paneTitle.d.ts.map +1 -1
- package/dist/engine/renderers/paneTitle.js +16 -11
- package/dist/engine/renderers/paneTitle.js.map +1 -1
- package/dist/engine/renderers/subVolume.d.ts.map +1 -1
- package/dist/engine/renderers/subVolume.js +23 -20
- package/dist/engine/renderers/subVolume.js.map +1 -1
- package/dist/engine/renderers/timeAxis.js +9 -9
- package/dist/engine/renderers/timeAxis.js.map +1 -1
- package/dist/engine/renderers/webgl/candleSurface.d.ts +4 -4
- package/dist/engine/renderers/webgl/candleSurface.d.ts.map +1 -1
- package/dist/engine/renderers/webgl/candleSurface.js +72 -60
- package/dist/engine/renderers/webgl/candleSurface.js.map +1 -1
- package/dist/engine/renderers/yAxis.d.ts.map +1 -1
- package/dist/engine/renderers/yAxis.js +5 -5
- package/dist/engine/renderers/yAxis.js.map +1 -1
- package/dist/engine/subPaneManager.d.ts +2 -0
- package/dist/engine/subPaneManager.d.ts.map +1 -1
- package/dist/engine/subPaneManager.js +25 -1
- package/dist/engine/subPaneManager.js.map +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -0
- package/dist/index.js.map +1 -1
- package/dist/plugin/types.d.ts +5 -1
- package/dist/plugin/types.d.ts.map +1 -1
- package/dist/plugin/types.js.map +1 -1
- package/dist/semantic/controller.d.ts +1 -2
- package/dist/semantic/controller.d.ts.map +1 -1
- package/dist/semantic/index.d.ts +1 -1
- package/dist/semantic/index.d.ts.map +1 -1
- package/dist/tokens/colorPresetSettings.d.ts +15 -0
- package/dist/tokens/colorPresetSettings.d.ts.map +1 -0
- package/dist/tokens/colorPresetSettings.js +65 -0
- package/dist/tokens/colorPresetSettings.js.map +1 -0
- package/dist/tokens/index.d.ts +17 -0
- package/dist/tokens/index.d.ts.map +1 -0
- package/dist/tokens/index.js +16 -0
- package/dist/tokens/index.js.map +1 -0
- package/dist/tokens/mergeTheme.d.ts +17 -0
- package/dist/tokens/mergeTheme.d.ts.map +1 -0
- package/dist/tokens/mergeTheme.js +43 -0
- package/dist/tokens/mergeTheme.js.map +1 -0
- package/dist/tokens/theme-china.d.ts +45 -0
- package/dist/tokens/theme-china.d.ts.map +1 -0
- package/dist/tokens/theme-china.js +116 -0
- package/dist/tokens/theme-china.js.map +1 -0
- package/dist/tokens/theme-dark.d.ts +21 -0
- package/dist/tokens/theme-dark.d.ts.map +1 -0
- package/dist/tokens/theme-dark.js +228 -0
- package/dist/tokens/theme-dark.js.map +1 -0
- package/dist/tokens/theme-light.d.ts +23 -0
- package/dist/tokens/theme-light.d.ts.map +1 -0
- package/dist/tokens/theme-light.js +234 -0
- package/dist/tokens/theme-light.js.map +1 -0
- package/dist/tokens/themeToCssVars.d.ts +74 -0
- package/dist/tokens/themeToCssVars.d.ts.map +1 -0
- package/dist/tokens/themeToCssVars.js +108 -0
- package/dist/tokens/themeToCssVars.js.map +1 -0
- package/dist/tokens/types.d.ts +335 -0
- package/dist/tokens/types.d.ts.map +1 -0
- package/dist/tokens/types.js +20 -0
- package/dist/tokens/types.js.map +1 -0
- package/dist/utils/kLineDraw/axis.d.ts +8 -7
- package/dist/utils/kLineDraw/axis.d.ts.map +1 -1
- package/dist/utils/kLineDraw/axis.js +24 -24
- package/dist/utils/kLineDraw/axis.js.map +1 -1
- package/dist/version.d.ts +1 -1
- package/dist/version.js +1 -1
- package/package.json +6 -6
- package/src/config/chartSettings.ts +11 -2
- package/src/controllers/createChartController.ts +158 -29
- package/src/controllers/index.ts +33 -0
- package/src/controllers/types.ts +79 -8
- package/src/engine/chart.ts +32 -37
- package/src/engine/controller/interaction.ts +9 -2
- package/src/engine/draw/pixelAlign.ts +0 -2
- package/src/engine/drawing/interaction.ts +38 -47
- package/src/engine/drawing/plugin.ts +1 -1
- package/src/engine/renderers/Indicator/atr.ts +7 -3
- package/src/engine/renderers/Indicator/boll.ts +12 -12
- package/src/engine/renderers/Indicator/cci.ts +11 -10
- package/src/engine/renderers/Indicator/ene.ts +12 -12
- package/src/engine/renderers/Indicator/expma.ts +6 -6
- package/src/engine/renderers/Indicator/fastk.ts +9 -8
- package/src/engine/renderers/Indicator/kst.ts +12 -11
- package/src/engine/renderers/Indicator/ma.ts +5 -5
- package/src/engine/renderers/Indicator/macd.ts +27 -25
- package/src/engine/renderers/Indicator/macdLegend.ts +6 -6
- package/src/engine/renderers/Indicator/mainIndicatorLegend.ts +16 -16
- package/src/engine/renderers/Indicator/mom.ts +11 -10
- package/src/engine/renderers/Indicator/rsi.ts +18 -15
- package/src/engine/renderers/Indicator/scale/indicator_scale.ts +6 -6
- package/src/engine/renderers/Indicator/stoch.ts +12 -11
- package/src/engine/renderers/Indicator/structure.ts +5 -5
- package/src/engine/renderers/Indicator/wmsr.ts +13 -12
- package/src/engine/renderers/Indicator/zones.ts +7 -7
- package/src/engine/renderers/candle.ts +21 -21
- package/src/engine/renderers/crosshair.ts +3 -3
- package/src/engine/renderers/extremaMarkers.ts +13 -12
- package/src/engine/renderers/gridLines.ts +3 -3
- package/src/engine/renderers/lastPrice.ts +7 -7
- package/src/engine/renderers/paneTitle.ts +22 -31
- package/src/engine/renderers/subVolume.ts +23 -20
- package/src/engine/renderers/timeAxis.ts +9 -9
- package/src/engine/renderers/webgl/candleSurface.ts +80 -60
- package/src/engine/renderers/yAxis.ts +6 -5
- package/src/engine/subPaneManager.ts +28 -1
- package/src/index.ts +1 -0
- package/src/plugin/types.ts +5 -1
- package/src/semantic/controller.ts +1 -1
- package/src/semantic/index.ts +1 -1
- package/src/tokens/__tests__/__snapshots__/baseline.test.ts.snap +393 -0
- package/src/tokens/__tests__/baseline.test.ts +183 -0
- package/src/tokens/__tests__/themeToCssVars.test.ts +175 -0
- package/src/tokens/__tests__/tokens.test.ts +215 -0
- package/src/tokens/colorPresetSettings.ts +128 -0
- package/src/tokens/index.ts +65 -0
- package/src/tokens/mergeTheme.ts +48 -0
- package/src/tokens/theme-china.ts +132 -0
- package/src/tokens/theme-dark.ts +244 -0
- package/src/tokens/theme-light.ts +250 -0
- package/src/tokens/themeToCssVars.ts +138 -0
- package/src/tokens/types.ts +394 -0
- package/src/utils/kLineDraw/axis.ts +31 -30
- package/src/version.ts +1 -1
- package/dist/engine/chart-store.d.ts +0 -75
- package/dist/engine/chart-store.d.ts.map +0 -1
- package/dist/engine/chart-store.js +0 -88
- package/dist/engine/chart-store.js.map +0 -1
- package/dist/engine/theme/colors.d.ts +0 -223
- package/dist/engine/theme/colors.d.ts.map +0 -1
- package/dist/engine/theme/colors.js +0 -375
- package/dist/engine/theme/colors.js.map +0 -1
- package/src/engine/chart-store.ts +0 -121
- package/src/engine/theme/colors.ts +0 -642
|
@@ -2,7 +2,7 @@ import type { RendererPluginWithHost, PluginHost, RenderContext } from '../../..
|
|
|
2
2
|
import { RENDERER_PRIORITY } from '../../../plugin'
|
|
3
3
|
import type { KLineData } from '../../../types/price'
|
|
4
4
|
import { alignToPhysicalPixelCenter } from '../../draw/pixelAlign'
|
|
5
|
-
import {
|
|
5
|
+
import { resolveThemeColors } from '../../../tokens'
|
|
6
6
|
import { BOLL_STATE_KEY, type BOLLRenderState } from '../../indicators/bollState'
|
|
7
7
|
import { Indicator } from '../../indicators/indicatorDefinitionRegistry'
|
|
8
8
|
import { resolveStateKey } from '../../indicators/indicatorMetadata'
|
|
@@ -54,7 +54,7 @@ function drawBOLLWithWebGL(
|
|
|
54
54
|
bandLowerPoints: LinePoint[]
|
|
55
55
|
}
|
|
56
56
|
): boolean {
|
|
57
|
-
const colors =
|
|
57
|
+
const colors = resolveThemeColors(context.theme, context.isAsiaMarket, context.colorPresetSettings)
|
|
58
58
|
if (context.settings?.enableWebGLRendering === false) return false
|
|
59
59
|
const surface = context.lineWebGLSurface
|
|
60
60
|
if (!surface || !surface.isAvailable()) return false
|
|
@@ -66,24 +66,24 @@ function drawBOLLWithWebGL(
|
|
|
66
66
|
surface.clear()
|
|
67
67
|
allOk = surface.drawFilledBand(
|
|
68
68
|
{ upperPoints: data.bandUpperPoints, lowerPoints: data.bandLowerPoints },
|
|
69
|
-
toOpaqueRgba(colors.
|
|
69
|
+
toOpaqueRgba(colors.boll.bandFill),
|
|
70
70
|
context.scrollLeft
|
|
71
71
|
)
|
|
72
72
|
if (allOk) {
|
|
73
|
-
compositeLineSurface(context, surface, getRgbaAlpha(colors.
|
|
73
|
+
compositeLineSurface(context, surface, getRgbaAlpha(colors.boll.bandFill))
|
|
74
74
|
}
|
|
75
75
|
}
|
|
76
76
|
surface.clear()
|
|
77
77
|
|
|
78
78
|
const lineStrips: Array<{ points: LinePoint[]; width: number; color: string }> = []
|
|
79
79
|
if (data.showUpper && data.upperPoints.length >= 2) {
|
|
80
|
-
lineStrips.push({ points: data.upperPoints, width: BOLL_LINE_WIDTH, color: colors.
|
|
80
|
+
lineStrips.push({ points: data.upperPoints, width: BOLL_LINE_WIDTH, color: colors.boll.upper })
|
|
81
81
|
}
|
|
82
82
|
if (data.showMiddle && data.middlePoints.length >= 2) {
|
|
83
|
-
lineStrips.push({ points: data.middlePoints, width: BOLL_LINE_WIDTH, color: colors.
|
|
83
|
+
lineStrips.push({ points: data.middlePoints, width: BOLL_LINE_WIDTH, color: colors.boll.middle })
|
|
84
84
|
}
|
|
85
85
|
if (data.showLower && data.lowerPoints.length >= 2) {
|
|
86
|
-
lineStrips.push({ points: data.lowerPoints, width: BOLL_LINE_WIDTH, color: colors.
|
|
86
|
+
lineStrips.push({ points: data.lowerPoints, width: BOLL_LINE_WIDTH, color: colors.boll.lower })
|
|
87
87
|
}
|
|
88
88
|
|
|
89
89
|
if (lineStrips.length > 0) {
|
|
@@ -183,7 +183,7 @@ export function createBOLLRendererPlugin(): RendererPluginWithHost {
|
|
|
183
183
|
draw(context: RenderContext) {
|
|
184
184
|
const { ctx, pane, data, range, scrollLeft, dpr, kLineCenters } = context
|
|
185
185
|
const klineData = data as KLineData[]
|
|
186
|
-
const colors =
|
|
186
|
+
const colors = resolveThemeColors(context.theme, context.isAsiaMarket, context.colorPresetSettings)
|
|
187
187
|
|
|
188
188
|
const stateKey = resolveKey()
|
|
189
189
|
if (!stateKey) return
|
|
@@ -281,7 +281,7 @@ export function createBOLLRendererPlugin(): RendererPluginWithHost {
|
|
|
281
281
|
bandPath.lineTo(bandLowerPoints[i].x, bandLowerPoints[i].y)
|
|
282
282
|
}
|
|
283
283
|
bandPath.closePath()
|
|
284
|
-
ctx.fillStyle = colors.
|
|
284
|
+
ctx.fillStyle = colors.boll.bandFill
|
|
285
285
|
ctx.fill(bandPath)
|
|
286
286
|
}
|
|
287
287
|
|
|
@@ -296,9 +296,9 @@ export function createBOLLRendererPlugin(): RendererPluginWithHost {
|
|
|
296
296
|
ctx.stroke()
|
|
297
297
|
}
|
|
298
298
|
|
|
299
|
-
if (showUpper) drawLine(upperPoints, colors.
|
|
300
|
-
if (showMiddle) drawLine(middlePoints, colors.
|
|
301
|
-
if (showLower) drawLine(lowerPoints, colors.
|
|
299
|
+
if (showUpper) drawLine(upperPoints, colors.boll.upper)
|
|
300
|
+
if (showMiddle) drawLine(middlePoints, colors.boll.middle)
|
|
301
|
+
if (showLower) drawLine(lowerPoints, colors.boll.lower)
|
|
302
302
|
|
|
303
303
|
ctx.restore()
|
|
304
304
|
},
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import type { RendererPluginWithHost, RenderContext, PluginHost } from '../../../plugin'
|
|
2
2
|
import { RENDERER_PRIORITY } from '../../../plugin'
|
|
3
|
-
import {
|
|
3
|
+
import { resolveThemeColors } from '../../../tokens'
|
|
4
4
|
import type { CCIRenderState } from '../../indicators/cciState'
|
|
5
5
|
import { createCCIStateKey } from '../../indicators/cciState'
|
|
6
6
|
import { Indicator } from '../../indicators/indicatorDefinitionRegistry'
|
|
@@ -92,7 +92,7 @@ export function createCCIRendererPlugin(options: CCIRendererOptions = {}): Rende
|
|
|
92
92
|
|
|
93
93
|
draw(context: RenderContext) {
|
|
94
94
|
const { ctx, pane, range, scrollLeft, dpr, kLineCenters, lineWebGLSurface } = context
|
|
95
|
-
const colors =
|
|
95
|
+
const colors = resolveThemeColors(context.theme, context.isAsiaMarket, context.colorPresetSettings)
|
|
96
96
|
|
|
97
97
|
const stateKey = resolveKey()
|
|
98
98
|
if (!stateKey) return
|
|
@@ -123,7 +123,7 @@ const { ctx, pane, range, scrollLeft, dpr, kLineCenters, lineWebGLSurface } = co
|
|
|
123
123
|
const lineStartX = scrollLeft
|
|
124
124
|
const lineEndX = scrollLeft + context.paneWidth
|
|
125
125
|
|
|
126
|
-
ctx.strokeStyle = colors.
|
|
126
|
+
ctx.strokeStyle = colors.cci.overbought
|
|
127
127
|
ctx.lineWidth = 1
|
|
128
128
|
ctx.setLineDash([4, 4])
|
|
129
129
|
ctx.beginPath()
|
|
@@ -131,7 +131,7 @@ const { ctx, pane, range, scrollLeft, dpr, kLineCenters, lineWebGLSurface } = co
|
|
|
131
131
|
ctx.lineTo(lineEndX, y100)
|
|
132
132
|
ctx.stroke()
|
|
133
133
|
|
|
134
|
-
ctx.strokeStyle = colors.
|
|
134
|
+
ctx.strokeStyle = colors.cci.oversold
|
|
135
135
|
ctx.beginPath()
|
|
136
136
|
ctx.moveTo(lineStartX, yNeg100)
|
|
137
137
|
ctx.lineTo(lineEndX, yNeg100)
|
|
@@ -177,7 +177,7 @@ const { ctx, pane, range, scrollLeft, dpr, kLineCenters, lineWebGLSurface } = co
|
|
|
177
177
|
if (enableWebGL && lineWebGLSurface?.isAvailable()) {
|
|
178
178
|
if (params.showCCI && cachedCCIPoints.length >= 2) {
|
|
179
179
|
const ok = lineWebGLSurface.drawLineStrips(
|
|
180
|
-
[{ points: cachedCCIPoints, width: 1, color: colors.
|
|
180
|
+
[{ points: cachedCCIPoints, width: 1, color: colors.cci.cci }],
|
|
181
181
|
scrollLeft
|
|
182
182
|
)
|
|
183
183
|
if (ok) {
|
|
@@ -213,13 +213,13 @@ function drawCCILineWithCanvas2D(
|
|
|
213
213
|
scrollLeft: number,
|
|
214
214
|
cciPoints: LinePoint[],
|
|
215
215
|
params: { showCCI: boolean },
|
|
216
|
-
colors: {
|
|
216
|
+
colors: { cci: { cci: string; overbought: string; oversold: string } }
|
|
217
217
|
): void {
|
|
218
218
|
if (!params.showCCI || cciPoints.length < 2) return
|
|
219
219
|
|
|
220
220
|
ctx.save()
|
|
221
221
|
ctx.translate(-scrollLeft, 0)
|
|
222
|
-
ctx.strokeStyle = colors.
|
|
222
|
+
ctx.strokeStyle = colors.cci.cci
|
|
223
223
|
ctx.lineWidth = 1
|
|
224
224
|
ctx.lineJoin = 'round'
|
|
225
225
|
ctx.lineCap = 'round'
|
|
@@ -241,9 +241,10 @@ export function getCCITitleInfo(
|
|
|
241
241
|
period: number,
|
|
242
242
|
pluginHost: PluginHost,
|
|
243
243
|
paneId: string = 'sub_CCI',
|
|
244
|
-
theme:
|
|
244
|
+
theme: 'light' | 'dark' = 'light',
|
|
245
|
+
isAsiaMarket?: boolean
|
|
245
246
|
): { name: string; params: number[]; values: Array<{ label: string; value: number; color: string }> } | null {
|
|
246
|
-
const colors =
|
|
247
|
+
const colors = resolveThemeColors(theme, isAsiaMarket)
|
|
247
248
|
const state = pluginHost.getSharedState<CCIRenderState>(createCCIStateKey(paneId))
|
|
248
249
|
if (!state) return null
|
|
249
250
|
|
|
@@ -254,7 +255,7 @@ export function getCCITitleInfo(
|
|
|
254
255
|
name: 'CCI',
|
|
255
256
|
params: [period],
|
|
256
257
|
values: [
|
|
257
|
-
{ label: 'CCI', value: cci, color: colors.
|
|
258
|
+
{ label: 'CCI', value: cci, color: colors.cci.cci },
|
|
258
259
|
],
|
|
259
260
|
}
|
|
260
261
|
}
|
|
@@ -2,7 +2,7 @@ import type { RendererPluginWithHost, PluginHost, RenderContext } from '../../..
|
|
|
2
2
|
import { RENDERER_PRIORITY } from '../../../plugin'
|
|
3
3
|
import type { KLineData } from '../../../types/price'
|
|
4
4
|
import { alignToPhysicalPixelCenter } from '../../draw/pixelAlign'
|
|
5
|
-
import {
|
|
5
|
+
import { resolveThemeColors } from '../../../tokens'
|
|
6
6
|
import { ENE_STATE_KEY, type ENERenderState } from '../../indicators/eneState'
|
|
7
7
|
import { Indicator } from '../../indicators/indicatorDefinitionRegistry'
|
|
8
8
|
import { resolveStateKey } from '../../indicators/indicatorMetadata'
|
|
@@ -40,7 +40,7 @@ function drawENEWithWebGL(
|
|
|
40
40
|
lowerPoints: LinePoint[]
|
|
41
41
|
}
|
|
42
42
|
): boolean {
|
|
43
|
-
const colors =
|
|
43
|
+
const colors = resolveThemeColors(context.theme, context.isAsiaMarket, context.colorPresetSettings)
|
|
44
44
|
if (context.settings?.enableWebGLRendering === false) return false
|
|
45
45
|
const surface = context.lineWebGLSurface
|
|
46
46
|
if (!surface || !surface.isAvailable()) return false
|
|
@@ -52,24 +52,24 @@ function drawENEWithWebGL(
|
|
|
52
52
|
surface.clear()
|
|
53
53
|
allOk = surface.drawFilledBand(
|
|
54
54
|
{ upperPoints: data.upperPoints, lowerPoints: data.lowerPoints },
|
|
55
|
-
toOpaqueRgba(colors.
|
|
55
|
+
toOpaqueRgba(colors.ene.bandFill),
|
|
56
56
|
context.scrollLeft
|
|
57
57
|
)
|
|
58
58
|
if (allOk) {
|
|
59
|
-
compositeLineSurface(context, surface, getRgbaAlpha(colors.
|
|
59
|
+
compositeLineSurface(context, surface, getRgbaAlpha(colors.ene.bandFill))
|
|
60
60
|
}
|
|
61
61
|
}
|
|
62
62
|
surface.clear()
|
|
63
63
|
|
|
64
64
|
const lineStrips: Array<{ points: LinePoint[]; width: number; color: string }> = []
|
|
65
65
|
if (data.upperPoints.length >= 2) {
|
|
66
|
-
lineStrips.push({ points: data.upperPoints, width: 1, color: colors.
|
|
66
|
+
lineStrips.push({ points: data.upperPoints, width: 1, color: colors.ene.upper })
|
|
67
67
|
}
|
|
68
68
|
if (data.middlePoints.length >= 2) {
|
|
69
|
-
lineStrips.push({ points: data.middlePoints, width: 1, color: colors.
|
|
69
|
+
lineStrips.push({ points: data.middlePoints, width: 1, color: colors.ene.middle })
|
|
70
70
|
}
|
|
71
71
|
if (data.lowerPoints.length >= 2) {
|
|
72
|
-
lineStrips.push({ points: data.lowerPoints, width: 1, color: colors.
|
|
72
|
+
lineStrips.push({ points: data.lowerPoints, width: 1, color: colors.ene.lower })
|
|
73
73
|
}
|
|
74
74
|
if (lineStrips.length > 0) {
|
|
75
75
|
allOk = surface.drawLineStrips(lineStrips, context.scrollLeft)
|
|
@@ -143,7 +143,7 @@ export function createENERendererPlugin(): RendererPluginWithHost {
|
|
|
143
143
|
draw(context: RenderContext) {
|
|
144
144
|
const { ctx, pane, data, range, scrollLeft, dpr, kLineCenters } = context
|
|
145
145
|
const klineData = data as KLineData[]
|
|
146
|
-
const colors =
|
|
146
|
+
const colors = resolveThemeColors(context.theme, context.isAsiaMarket, context.colorPresetSettings)
|
|
147
147
|
|
|
148
148
|
const stateKey = resolveKey()
|
|
149
149
|
if (!stateKey) return
|
|
@@ -193,7 +193,7 @@ export function createENERendererPlugin(): RendererPluginWithHost {
|
|
|
193
193
|
ctx.save()
|
|
194
194
|
ctx.translate(-scrollLeft, 0)
|
|
195
195
|
|
|
196
|
-
ctx.fillStyle = colors.
|
|
196
|
+
ctx.fillStyle = colors.ene.bandFill
|
|
197
197
|
ctx.beginPath()
|
|
198
198
|
if (upperPoints.length > 0) {
|
|
199
199
|
ctx.moveTo(upperPoints[0]!.x, upperPoints[0]!.y)
|
|
@@ -225,9 +225,9 @@ export function createENERendererPlugin(): RendererPluginWithHost {
|
|
|
225
225
|
ctx.stroke()
|
|
226
226
|
}
|
|
227
227
|
|
|
228
|
-
drawLine(upperPoints, colors.
|
|
229
|
-
drawLine(middlePoints, colors.
|
|
230
|
-
drawLine(lowerPoints, colors.
|
|
228
|
+
drawLine(upperPoints, colors.ene.upper)
|
|
229
|
+
drawLine(middlePoints, colors.ene.middle)
|
|
230
|
+
drawLine(lowerPoints, colors.ene.lower)
|
|
231
231
|
|
|
232
232
|
ctx.restore()
|
|
233
233
|
},
|
|
@@ -2,7 +2,7 @@ import type { RendererPluginWithHost, PluginHost, RenderContext } from '../../..
|
|
|
2
2
|
import { RENDERER_PRIORITY } from '../../../plugin'
|
|
3
3
|
import type { KLineData } from '../../../types/price'
|
|
4
4
|
import { alignToPhysicalPixelCenter } from '../../draw/pixelAlign'
|
|
5
|
-
import {
|
|
5
|
+
import { resolveThemeColors } from '../../../tokens'
|
|
6
6
|
import { EXPMA_STATE_KEY, type EXPMARenderState } from '../../indicators/expmaState'
|
|
7
7
|
import { Indicator } from '../../indicators/indicatorDefinitionRegistry'
|
|
8
8
|
import { resolveStateKey } from '../../indicators/indicatorMetadata'
|
|
@@ -82,7 +82,7 @@ export function createEXPMARendererPlugin(): RendererPluginWithHost {
|
|
|
82
82
|
draw(context: RenderContext) {
|
|
83
83
|
const { ctx, pane, data, range, scrollLeft, dpr, kLineCenters, lineWebGLSurface } = context
|
|
84
84
|
const klineData = data as KLineData[]
|
|
85
|
-
const colors =
|
|
85
|
+
const colors = resolveThemeColors(context.theme, context.isAsiaMarket, context.colorPresetSettings)
|
|
86
86
|
const stateKey = resolveKey()
|
|
87
87
|
if (!stateKey) return
|
|
88
88
|
const state = pluginHost?.getSharedState<EXPMARenderState>(stateKey)
|
|
@@ -123,10 +123,10 @@ export function createEXPMARendererPlugin(): RendererPluginWithHost {
|
|
|
123
123
|
if (enableWebGL && lineWebGLSurface?.isAvailable()) {
|
|
124
124
|
const lines: Array<{ points: LinePoint[]; width: number; color: string }> = []
|
|
125
125
|
if (cachedFastPoints.length >= 2) {
|
|
126
|
-
lines.push({ points: cachedFastPoints, width: 1, color: colors.
|
|
126
|
+
lines.push({ points: cachedFastPoints, width: 1, color: colors.expma.fast })
|
|
127
127
|
}
|
|
128
128
|
if (cachedSlowPoints.length >= 2) {
|
|
129
|
-
lines.push({ points: cachedSlowPoints, width: 1, color: colors.
|
|
129
|
+
lines.push({ points: cachedSlowPoints, width: 1, color: colors.expma.slow })
|
|
130
130
|
}
|
|
131
131
|
|
|
132
132
|
const allOk = lines.length > 0 && lineWebGLSurface.drawLineStrips(lines, scrollLeft)
|
|
@@ -146,7 +146,7 @@ export function createEXPMARendererPlugin(): RendererPluginWithHost {
|
|
|
146
146
|
ctx.lineCap = 'round'
|
|
147
147
|
|
|
148
148
|
if (cachedFastPoints.length >= 2) {
|
|
149
|
-
ctx.strokeStyle = colors.
|
|
149
|
+
ctx.strokeStyle = colors.expma.fast
|
|
150
150
|
ctx.beginPath()
|
|
151
151
|
ctx.moveTo(cachedFastPoints[0]!.x, cachedFastPoints[0]!.y)
|
|
152
152
|
for (let i = 1; i < cachedFastPoints.length; i++) {
|
|
@@ -157,7 +157,7 @@ export function createEXPMARendererPlugin(): RendererPluginWithHost {
|
|
|
157
157
|
}
|
|
158
158
|
|
|
159
159
|
if (cachedSlowPoints.length >= 2) {
|
|
160
|
-
ctx.strokeStyle = colors.
|
|
160
|
+
ctx.strokeStyle = colors.expma.slow
|
|
161
161
|
ctx.beginPath()
|
|
162
162
|
ctx.moveTo(cachedSlowPoints[0]!.x, cachedSlowPoints[0]!.y)
|
|
163
163
|
for (let i = 1; i < cachedSlowPoints.length; i++) {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import type { RendererPluginWithHost, RenderContext, PluginHost } from '../../../plugin'
|
|
2
2
|
import { RENDERER_PRIORITY } from '../../../plugin'
|
|
3
|
-
import {
|
|
3
|
+
import { resolveThemeColors } from '../../../tokens'
|
|
4
4
|
import { alignToPhysicalPixelCenter } from '../../draw/pixelAlign'
|
|
5
5
|
import type { FASTKRenderState } from '../../indicators/fastkState'
|
|
6
6
|
import { createFASTKStateKey } from '../../indicators/fastkState'
|
|
@@ -148,7 +148,7 @@ export function createFASTKRendererPlugin(options: FASTKRendererOptions = {}): R
|
|
|
148
148
|
|
|
149
149
|
draw(context: RenderContext) {
|
|
150
150
|
const { ctx, pane, range, scrollLeft, dpr, kLineCenters, lineWebGLSurface } = context
|
|
151
|
-
const colors =
|
|
151
|
+
const colors = resolveThemeColors(context.theme, context.isAsiaMarket, context.colorPresetSettings)
|
|
152
152
|
|
|
153
153
|
const stateKey = resolveKey()
|
|
154
154
|
if (!stateKey) return
|
|
@@ -218,7 +218,7 @@ const { ctx, pane, range, scrollLeft, dpr, kLineCenters, lineWebGLSurface } = co
|
|
|
218
218
|
if (enableWebGL && lineWebGLSurface?.isAvailable()) {
|
|
219
219
|
if (params.showFASTK && cachedFASTKPoints.length >= 2) {
|
|
220
220
|
const ok = lineWebGLSurface.drawLineStrips(
|
|
221
|
-
[{ points: cachedFASTKPoints, width: 1, color: colors.
|
|
221
|
+
[{ points: cachedFASTKPoints, width: 1, color: colors.kdj.k }],
|
|
222
222
|
scrollLeft
|
|
223
223
|
)
|
|
224
224
|
if (ok) {
|
|
@@ -254,13 +254,13 @@ function drawFASTKLineWithCanvas2D(
|
|
|
254
254
|
scrollLeft: number,
|
|
255
255
|
fastkPoints: LinePoint[],
|
|
256
256
|
params: { showFASTK: boolean },
|
|
257
|
-
colors: {
|
|
257
|
+
colors: { kdj: { k: string } }
|
|
258
258
|
): void {
|
|
259
259
|
if (!params.showFASTK || fastkPoints.length < 2) return
|
|
260
260
|
|
|
261
261
|
ctx.save()
|
|
262
262
|
ctx.translate(-scrollLeft, 0)
|
|
263
|
-
ctx.strokeStyle = colors.
|
|
263
|
+
ctx.strokeStyle = colors.kdj.k
|
|
264
264
|
ctx.lineWidth = 1
|
|
265
265
|
ctx.lineJoin = 'round'
|
|
266
266
|
ctx.lineCap = 'round'
|
|
@@ -282,9 +282,10 @@ export function getFASTKTitleInfo(
|
|
|
282
282
|
period: number,
|
|
283
283
|
pluginHost: PluginHost,
|
|
284
284
|
paneId: string = 'sub_FASTK',
|
|
285
|
-
theme:
|
|
285
|
+
theme: 'light' | 'dark' = 'light',
|
|
286
|
+
isAsiaMarket?: boolean
|
|
286
287
|
): { name: string; params: number[]; values: Array<{ label: string; value: number; color: string }> } | null {
|
|
287
|
-
const colors =
|
|
288
|
+
const colors = resolveThemeColors(theme, isAsiaMarket)
|
|
288
289
|
const state = pluginHost.getSharedState<FASTKRenderState>(createFASTKStateKey(paneId))
|
|
289
290
|
if (!state) return null
|
|
290
291
|
|
|
@@ -295,7 +296,7 @@ export function getFASTKTitleInfo(
|
|
|
295
296
|
name: 'FASTK',
|
|
296
297
|
params: [period],
|
|
297
298
|
values: [
|
|
298
|
-
{ label: 'FASTK', value: fastk, color: colors.
|
|
299
|
+
{ label: 'FASTK', value: fastk, color: colors.kdj.k },
|
|
299
300
|
],
|
|
300
301
|
}
|
|
301
302
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import type { RendererPluginWithHost, RenderContext, PluginHost } from '../../../plugin'
|
|
2
2
|
import { RENDERER_PRIORITY } from '../../../plugin'
|
|
3
|
-
import {
|
|
3
|
+
import { resolveThemeColors } from '../../../tokens'
|
|
4
4
|
import type { KSTRenderState } from '../../indicators/kstState'
|
|
5
5
|
import { createKSTStateKey } from '../../indicators/kstState'
|
|
6
6
|
import { Indicator } from '../../indicators/indicatorDefinitionRegistry'
|
|
@@ -99,7 +99,7 @@ export function createKSTRendererPlugin(options: KSTRendererOptions = {}): Rende
|
|
|
99
99
|
|
|
100
100
|
draw(context: RenderContext) {
|
|
101
101
|
const { ctx, pane, range, scrollLeft, dpr, kLineCenters, lineWebGLSurface } = context
|
|
102
|
-
const colors =
|
|
102
|
+
const colors = resolveThemeColors(context.theme, context.isAsiaMarket, context.colorPresetSettings)
|
|
103
103
|
|
|
104
104
|
const stateKey = resolveKey()
|
|
105
105
|
if (!stateKey) return
|
|
@@ -178,10 +178,10 @@ const { ctx, pane, range, scrollLeft, dpr, kLineCenters, lineWebGLSurface } = co
|
|
|
178
178
|
if (enableWebGL && lineWebGLSurface?.isAvailable()) {
|
|
179
179
|
const lines: Array<{ points: LinePoint[]; width: number; color: string }> = []
|
|
180
180
|
if (params.showKST && cachedKSTPoints.length >= 2) {
|
|
181
|
-
lines.push({ points: cachedKSTPoints, width: 1, color: colors.
|
|
181
|
+
lines.push({ points: cachedKSTPoints, width: 1, color: colors.kst.kst })
|
|
182
182
|
}
|
|
183
183
|
if (params.showSignal && cachedSignalPoints.length >= 2) {
|
|
184
|
-
lines.push({ points: cachedSignalPoints, width: 1, color: colors.
|
|
184
|
+
lines.push({ points: cachedSignalPoints, width: 1, color: colors.kst.signal })
|
|
185
185
|
}
|
|
186
186
|
|
|
187
187
|
const allOk = lines.length > 0 && lineWebGLSurface.drawLineStrips(lines, scrollLeft)
|
|
@@ -219,7 +219,7 @@ function drawKSTLinesWithCanvas2D(
|
|
|
219
219
|
kstPoints: LinePoint[],
|
|
220
220
|
signalPoints: LinePoint[],
|
|
221
221
|
params: { showKST: boolean; showSignal: boolean },
|
|
222
|
-
colors: {
|
|
222
|
+
colors: { kst: { kst: string; signal: string } }
|
|
223
223
|
): void {
|
|
224
224
|
ctx.save()
|
|
225
225
|
ctx.translate(-scrollLeft, 0)
|
|
@@ -228,7 +228,7 @@ function drawKSTLinesWithCanvas2D(
|
|
|
228
228
|
ctx.lineCap = 'round'
|
|
229
229
|
|
|
230
230
|
if (params.showKST && kstPoints.length >= 2) {
|
|
231
|
-
ctx.strokeStyle = colors.
|
|
231
|
+
ctx.strokeStyle = colors.kst.kst
|
|
232
232
|
ctx.beginPath()
|
|
233
233
|
ctx.moveTo(kstPoints[0]!.x, kstPoints[0]!.y)
|
|
234
234
|
for (let i = 1; i < kstPoints.length; i++) {
|
|
@@ -239,7 +239,7 @@ function drawKSTLinesWithCanvas2D(
|
|
|
239
239
|
}
|
|
240
240
|
|
|
241
241
|
if (params.showSignal && signalPoints.length >= 2) {
|
|
242
|
-
ctx.strokeStyle = colors.
|
|
242
|
+
ctx.strokeStyle = colors.kst.signal
|
|
243
243
|
ctx.beginPath()
|
|
244
244
|
ctx.moveTo(signalPoints[0]!.x, signalPoints[0]!.y)
|
|
245
245
|
for (let i = 1; i < signalPoints.length; i++) {
|
|
@@ -264,9 +264,10 @@ export function getKSTTitleInfo(
|
|
|
264
264
|
signalPeriod: number,
|
|
265
265
|
pluginHost: PluginHost,
|
|
266
266
|
paneId: string = 'sub_KST',
|
|
267
|
-
theme:
|
|
267
|
+
theme: 'light' | 'dark' = 'light',
|
|
268
|
+
isAsiaMarket?: boolean
|
|
268
269
|
): { name: string; params: number[]; values: Array<{ label: string; value: number; color: string }> } | null {
|
|
269
|
-
const colors =
|
|
270
|
+
const colors = resolveThemeColors(theme, isAsiaMarket)
|
|
270
271
|
const state = pluginHost.getSharedState<KSTRenderState>(createKSTStateKey(paneId))
|
|
271
272
|
if (!state) return null
|
|
272
273
|
|
|
@@ -274,8 +275,8 @@ export function getKSTTitleInfo(
|
|
|
274
275
|
if (!point) return null
|
|
275
276
|
|
|
276
277
|
const values = []
|
|
277
|
-
if (state.params.showKST) values.push({ label: 'KST', value: point.kst, color: colors.
|
|
278
|
-
if (state.params.showSignal) values.push({ label: 'Signal', value: point.signal, color: colors.
|
|
278
|
+
if (state.params.showKST) values.push({ label: 'KST', value: point.kst, color: colors.kst.kst })
|
|
279
|
+
if (state.params.showSignal) values.push({ label: 'Signal', value: point.signal, color: colors.kst.signal })
|
|
279
280
|
|
|
280
281
|
if (values.length === 0) return null
|
|
281
282
|
|
|
@@ -5,7 +5,7 @@ import { Indicator } from '../../indicators/indicatorDefinitionRegistry'
|
|
|
5
5
|
import { resolveStateKey } from '../../indicators/indicatorMetadata'
|
|
6
6
|
import type { IndicatorScheduler } from '../../indicators/scheduler'
|
|
7
7
|
import { alignToPhysicalPixelCenter } from '../../draw/pixelAlign'
|
|
8
|
-
import {
|
|
8
|
+
import { resolveThemeColors } from '../../../tokens'
|
|
9
9
|
|
|
10
10
|
// Re-export MAFlags from calculators for backward compatibility
|
|
11
11
|
export type { MAFlags } from '../../indicators/calculators'
|
|
@@ -97,8 +97,8 @@ export function createMARendererPlugin(): RendererPluginWithHost {
|
|
|
97
97
|
|
|
98
98
|
draw(context: RenderContext) {
|
|
99
99
|
const { ctx, pane, range, scrollLeft, dpr, kLineCenters, lineWebGLSurface } = context
|
|
100
|
-
const colors =
|
|
101
|
-
const maColors: Record<number, string> = { 5: colors.
|
|
100
|
+
const colors = resolveThemeColors(context.theme, context.isAsiaMarket, context.colorPresetSettings)
|
|
101
|
+
const maColors: Record<number, string> = { 5: colors.ma.ma5, 10: colors.ma.ma10, 20: colors.ma.ma20, 30: colors.ma.ma30, 60: colors.ma.ma60 }
|
|
102
102
|
const stateKey = resolveKey()
|
|
103
103
|
if (!stateKey) return
|
|
104
104
|
const state = pluginHost?.getSharedState<MARenderState>(stateKey)
|
|
@@ -147,7 +147,7 @@ export function createMARendererPlugin(): RendererPluginWithHost {
|
|
|
147
147
|
for (const period of state.enabledPeriods) {
|
|
148
148
|
const points = cachedLines.get(period)
|
|
149
149
|
if (!points) continue
|
|
150
|
-
lines.push({ points, width: 1, color: maColors[period] ?? colors.
|
|
150
|
+
lines.push({ points, width: 1, color: maColors[period] ?? colors.ma.ma5 })
|
|
151
151
|
}
|
|
152
152
|
const allOk = lines.length > 0 && lineWebGLSurface.drawLineStrips(lines, scrollLeft)
|
|
153
153
|
|
|
@@ -170,7 +170,7 @@ export function createMARendererPlugin(): RendererPluginWithHost {
|
|
|
170
170
|
for (const period of state.enabledPeriods) {
|
|
171
171
|
const points = cachedLines.get(period)
|
|
172
172
|
if (!points || points.length < 2) continue
|
|
173
|
-
ctx.strokeStyle = maColors[period] ?? colors.
|
|
173
|
+
ctx.strokeStyle = maColors[period] ?? colors.ma.ma5
|
|
174
174
|
ctx.beginPath()
|
|
175
175
|
ctx.moveTo(points[0]!.x, points[0]!.y)
|
|
176
176
|
for (let i = 1; i < points.length; i++) {
|
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
import type { RendererPluginWithHost, RenderContext, PluginHost } from '../../../plugin'
|
|
2
2
|
import { RENDERER_PRIORITY } from '../../../plugin'
|
|
3
3
|
import type { KLineData } from '../../../types/price'
|
|
4
|
-
import {
|
|
5
|
-
import type { ChartTheme, ThemeColors } from '../../theme/colors'
|
|
4
|
+
import { resolveThemeColors } from '../../../tokens'
|
|
6
5
|
import { alignToPhysicalPixelCenter } from '../../draw/pixelAlign'
|
|
7
6
|
import type { MACDRenderState } from '../../indicators/macdState'
|
|
8
7
|
import { createMACDStateKey } from '../../indicators/macdState'
|
|
@@ -131,7 +130,7 @@ export function createMACDRendererPlugin(options: MACDRendererOptions = {}): Ren
|
|
|
131
130
|
draw(context: RenderContext) {
|
|
132
131
|
const { ctx, pane, data, range, scrollLeft, dpr, kLineCenters, lineWebGLSurface } = context
|
|
133
132
|
const klineData = data as KLineData[]
|
|
134
|
-
const colors =
|
|
133
|
+
const colors = resolveThemeColors(context.theme, context.isAsiaMarket, context.colorPresetSettings)
|
|
135
134
|
|
|
136
135
|
// 从 StateStore 读取 MACD 状态
|
|
137
136
|
const stateKey = resolveKey()
|
|
@@ -214,7 +213,7 @@ export function createMACDRendererPlugin(options: MACDRendererOptions = {}): Ren
|
|
|
214
213
|
|
|
215
214
|
const usedWebGL = drawMacdBarsWithWebGL(context, barUpBuf, barUpCount, barUpLightBuf, barUpLightCount, barDownBuf, barDownCount, barDownLightBuf, barDownLightCount)
|
|
216
215
|
if (!usedWebGL) {
|
|
217
|
-
drawMacdBarsWithCanvas2D(ctx, scrollLeft, colors, barUpBuf, barUpCount, barUpLightBuf, barUpLightCount, barDownBuf, barDownCount, barDownLightBuf, barDownLightCount)
|
|
216
|
+
drawMacdBarsWithCanvas2D(ctx, scrollLeft, colors.macd.barUp, colors.macd.barUpLight, colors.macd.barDown, colors.macd.barDownLight, barUpBuf, barUpCount, barUpLightBuf, barUpLightCount, barDownBuf, barDownCount, barDownLightBuf, barDownLightCount)
|
|
218
217
|
} else {
|
|
219
218
|
compositeMacdWebGL(ctx, context)
|
|
220
219
|
}
|
|
@@ -256,10 +255,10 @@ export function createMACDRendererPlugin(options: MACDRendererOptions = {}): Ren
|
|
|
256
255
|
if (enableWebGL && lineWebGLSurface?.isAvailable()) {
|
|
257
256
|
const lines: Array<{ points: LinePoint[]; width: number; color: string }> = []
|
|
258
257
|
if (config.showDIF && cachedDifPoints.length >= 2) {
|
|
259
|
-
lines.push({ points: cachedDifPoints, width: 1, color: colors.
|
|
258
|
+
lines.push({ points: cachedDifPoints, width: 1, color: colors.macd.dif })
|
|
260
259
|
}
|
|
261
260
|
if (config.showDEA && cachedDeaPoints.length >= 2) {
|
|
262
|
-
lines.push({ points: cachedDeaPoints, width: 1, color: colors.
|
|
261
|
+
lines.push({ points: cachedDeaPoints, width: 1, color: colors.macd.dea })
|
|
263
262
|
}
|
|
264
263
|
const allOk = lines.length > 0 && lineWebGLSurface.drawLineStrips(lines, scrollLeft)
|
|
265
264
|
if (allOk) {
|
|
@@ -269,7 +268,7 @@ export function createMACDRendererPlugin(options: MACDRendererOptions = {}): Ren
|
|
|
269
268
|
}
|
|
270
269
|
|
|
271
270
|
if (!usedWebGLForLines) {
|
|
272
|
-
drawMacdLinesWithCanvas2D(ctx, scrollLeft, colors, cachedDifPoints, cachedDeaPoints, config)
|
|
271
|
+
drawMacdLinesWithCanvas2D(ctx, scrollLeft, colors.macd.dif, colors.macd.dea, cachedDifPoints, cachedDeaPoints, config)
|
|
273
272
|
}
|
|
274
273
|
},
|
|
275
274
|
|
|
@@ -313,17 +312,17 @@ function drawMacdBarsWithWebGL(
|
|
|
313
312
|
barDownBuf: Float32Array, barDownCount: number,
|
|
314
313
|
barDownLightBuf: Float32Array, barDownLightCount: number
|
|
315
314
|
): boolean {
|
|
316
|
-
const colors =
|
|
315
|
+
const colors = resolveThemeColors(context.theme, context.isAsiaMarket, context.colorPresetSettings)
|
|
317
316
|
if (context.settings?.enableWebGLRendering === false) return false
|
|
318
317
|
const surface = context.candleWebGLSurface
|
|
319
318
|
if (!surface || !surface.isAvailable()) return false
|
|
320
319
|
|
|
321
320
|
surface.clear()
|
|
322
321
|
|
|
323
|
-
const ok1 = barUpCount === 0 || surface.drawRectBuffer(barUpBuf.subarray(0, barUpCount * 4), barUpCount, colors.
|
|
324
|
-
const ok2 = barUpLightCount === 0 || surface.drawRectBuffer(barUpLightBuf.subarray(0, barUpLightCount * 4), barUpLightCount, colors.
|
|
325
|
-
const ok3 = barDownCount === 0 || surface.drawRectBuffer(barDownBuf.subarray(0, barDownCount * 4), barDownCount, colors.
|
|
326
|
-
const ok4 = barDownLightCount === 0 || surface.drawRectBuffer(barDownLightBuf.subarray(0, barDownLightCount * 4), barDownLightCount, colors.
|
|
322
|
+
const ok1 = barUpCount === 0 || surface.drawRectBuffer(barUpBuf.subarray(0, barUpCount * 4), barUpCount, colors.macd.barUp, context.scrollLeft)
|
|
323
|
+
const ok2 = barUpLightCount === 0 || surface.drawRectBuffer(barUpLightBuf.subarray(0, barUpLightCount * 4), barUpLightCount, colors.macd.barUpLight, context.scrollLeft)
|
|
324
|
+
const ok3 = barDownCount === 0 || surface.drawRectBuffer(barDownBuf.subarray(0, barDownCount * 4), barDownCount, colors.macd.barDown, context.scrollLeft)
|
|
325
|
+
const ok4 = barDownLightCount === 0 || surface.drawRectBuffer(barDownLightBuf.subarray(0, barDownLightCount * 4), barDownLightCount, colors.macd.barDownLight, context.scrollLeft)
|
|
327
326
|
|
|
328
327
|
return ok1 && ok2 && ok3 && ok4
|
|
329
328
|
}
|
|
@@ -331,7 +330,8 @@ function drawMacdBarsWithWebGL(
|
|
|
331
330
|
function drawMacdBarsWithCanvas2D(
|
|
332
331
|
ctx: CanvasRenderingContext2D,
|
|
333
332
|
scrollLeft: number,
|
|
334
|
-
|
|
333
|
+
barUpColor: string, barUpLightColor: string,
|
|
334
|
+
barDownColor: string, barDownLightColor: string,
|
|
335
335
|
barUpBuf: Float32Array, barUpCount: number,
|
|
336
336
|
barUpLightBuf: Float32Array, barUpLightCount: number,
|
|
337
337
|
barDownBuf: Float32Array, barDownCount: number,
|
|
@@ -340,25 +340,25 @@ function drawMacdBarsWithCanvas2D(
|
|
|
340
340
|
ctx.save()
|
|
341
341
|
ctx.translate(-scrollLeft, 0)
|
|
342
342
|
|
|
343
|
-
ctx.fillStyle =
|
|
343
|
+
ctx.fillStyle = barUpColor
|
|
344
344
|
for (let i = 0; i < barUpCount; i++) {
|
|
345
345
|
const off = i * 4
|
|
346
346
|
ctx.fillRect(barUpBuf[off], barUpBuf[off + 1], barUpBuf[off + 2], barUpBuf[off + 3])
|
|
347
347
|
}
|
|
348
348
|
|
|
349
|
-
ctx.fillStyle =
|
|
349
|
+
ctx.fillStyle = barUpLightColor
|
|
350
350
|
for (let i = 0; i < barUpLightCount; i++) {
|
|
351
351
|
const off = i * 4
|
|
352
352
|
ctx.fillRect(barUpLightBuf[off], barUpLightBuf[off + 1], barUpLightBuf[off + 2], barUpLightBuf[off + 3])
|
|
353
353
|
}
|
|
354
354
|
|
|
355
|
-
ctx.fillStyle =
|
|
355
|
+
ctx.fillStyle = barDownColor
|
|
356
356
|
for (let i = 0; i < barDownCount; i++) {
|
|
357
357
|
const off = i * 4
|
|
358
358
|
ctx.fillRect(barDownBuf[off], barDownBuf[off + 1], barDownBuf[off + 2], barDownBuf[off + 3])
|
|
359
359
|
}
|
|
360
360
|
|
|
361
|
-
ctx.fillStyle =
|
|
361
|
+
ctx.fillStyle = barDownLightColor
|
|
362
362
|
for (let i = 0; i < barDownLightCount; i++) {
|
|
363
363
|
const off = i * 4
|
|
364
364
|
ctx.fillRect(barDownLightBuf[off], barDownLightBuf[off + 1], barDownLightBuf[off + 2], barDownLightBuf[off + 3])
|
|
@@ -370,7 +370,8 @@ function drawMacdBarsWithCanvas2D(
|
|
|
370
370
|
function drawMacdLinesWithCanvas2D(
|
|
371
371
|
ctx: CanvasRenderingContext2D,
|
|
372
372
|
scrollLeft: number,
|
|
373
|
-
|
|
373
|
+
difColor: string,
|
|
374
|
+
deaColor: string,
|
|
374
375
|
difPoints: LinePoint[],
|
|
375
376
|
deaPoints: LinePoint[],
|
|
376
377
|
config: { showDIF: boolean; showDEA: boolean }
|
|
@@ -382,7 +383,7 @@ function drawMacdLinesWithCanvas2D(
|
|
|
382
383
|
ctx.lineCap = 'round'
|
|
383
384
|
|
|
384
385
|
if (config.showDIF && difPoints.length >= 2) {
|
|
385
|
-
ctx.strokeStyle =
|
|
386
|
+
ctx.strokeStyle = difColor
|
|
386
387
|
ctx.beginPath()
|
|
387
388
|
ctx.moveTo(difPoints[0]!.x, difPoints[0]!.y)
|
|
388
389
|
for (let i = 1; i < difPoints.length; i++) {
|
|
@@ -393,7 +394,7 @@ function drawMacdLinesWithCanvas2D(
|
|
|
393
394
|
}
|
|
394
395
|
|
|
395
396
|
if (config.showDEA && deaPoints.length >= 2) {
|
|
396
|
-
ctx.strokeStyle =
|
|
397
|
+
ctx.strokeStyle = deaColor
|
|
397
398
|
ctx.beginPath()
|
|
398
399
|
ctx.moveTo(deaPoints[0]!.x, deaPoints[0]!.y)
|
|
399
400
|
for (let i = 1; i < deaPoints.length; i++) {
|
|
@@ -441,9 +442,10 @@ export function getMACDTitleInfo(
|
|
|
441
442
|
signalPeriod: number,
|
|
442
443
|
pluginHost: PluginHost,
|
|
443
444
|
paneId: string = 'sub_MACD',
|
|
444
|
-
theme:
|
|
445
|
+
theme: 'light' | 'dark' = 'light',
|
|
446
|
+
isAsiaMarket?: boolean
|
|
445
447
|
): { name: string; params: number[]; values: Array<{ label: string; value: number; color: string }> } | null {
|
|
446
|
-
const colors =
|
|
448
|
+
const colors = resolveThemeColors(theme, isAsiaMarket)
|
|
447
449
|
const state = pluginHost.getSharedState<MACDRenderState>(createMACDStateKey(paneId))
|
|
448
450
|
if (!state) return null
|
|
449
451
|
|
|
@@ -454,9 +456,9 @@ export function getMACDTitleInfo(
|
|
|
454
456
|
name: 'MACD',
|
|
455
457
|
params: [fastPeriod, slowPeriod, signalPeriod],
|
|
456
458
|
values: [
|
|
457
|
-
{ label: 'DIF', value: point.dif, color: colors.
|
|
458
|
-
{ label: 'DEA', value: point.dea, color: colors.
|
|
459
|
-
{ label: 'MACD', value: point.macd, color: point.macd >= 0 ? colors.
|
|
459
|
+
{ label: 'DIF', value: point.dif, color: colors.macd.dif },
|
|
460
|
+
{ label: 'DEA', value: point.dea, color: colors.macd.dea },
|
|
461
|
+
{ label: 'MACD', value: point.macd, color: point.macd >= 0 ? colors.macd.barUp : colors.macd.barDown },
|
|
460
462
|
],
|
|
461
463
|
}
|
|
462
464
|
}
|