diff --git a/web/frontend/src/components/KLineChart.vue b/web/frontend/src/components/KLineChart.vue
index a3e02d8..4075e34 100644
--- a/web/frontend/src/components/KLineChart.vue
+++ b/web/frontend/src/components/KLineChart.vue
@@ -43,8 +43,8 @@ function render() {
{ type: 'category', gridIndex: 1, data: dates, scale: true, boundaryGap: false, axisLabel: { show: false } },
]
const yAxes: any[] = [
- { scale: true, splitArea: { show: true } },
- { gridIndex: 1, scale: true, splitNumber: 3 },
+ { scale: true, splitArea: { show: true }, name: '价格', nameLocation: 'end', nameTextStyle: { fontSize: 11 } },
+ { gridIndex: 1, scale: true, splitNumber: 3, name: '持仓', nameLocation: 'end', nameTextStyle: { fontSize: 11 } },
]
const series: any[] = [
{
@@ -74,7 +74,7 @@ function render() {
if (hasScores) {
grids.push({ left: isMobile.value ? 48 : 60, right: isMobile.value ? 12 : 40, top: '88%', height: '10%' })
xAxes.push({ type: 'category', gridIndex: 2, data: dates, scale: true, boundaryGap: false, axisLabel: { show: false } })
- yAxes.push({ gridIndex: 2, min: 0, max: 100, splitNumber: 2 })
+ yAxes.push({ gridIndex: 2, min: 0, max: 100, splitNumber: 2, name: '综合分', nameLocation: 'end', nameTextStyle: { fontSize: 11 } })
series.push({
name: '综合分',
type: 'bar',
@@ -98,7 +98,30 @@ function render() {
chart.setOption(
{
backgroundColor: 'transparent',
- tooltip: { trigger: 'axis', axisPointer: { type: 'cross' } },
+ tooltip: {
+ trigger: 'axis',
+ axisPointer: { type: 'cross' },
+ formatter: (params: any) => {
+ if (!Array.isArray(params)) return ''
+ const date = params[0]?.axisValue || ''
+ let html = `${date}
`
+ for (const p of params) {
+ if (p.seriesName === 'K 线') {
+ const ohlc = p.data as number[]
+ const labels = ['开盘', '收盘', '最低', '最高']
+ html += labels.map((n, i) => `${p.marker} ${n}: ${ohlc[i] ?? '-'}`).join('
') + '
'
+ continue
+ }
+ let name = p.seriesName
+ let val: string
+ if (name === '持仓量') val = (p.data as number)?.toLocaleString() ?? '-'
+ else if (name === '综合分') val = (p.data as number)?.toFixed(1) ?? '-'
+ else val = p.data ?? '-'
+ html += `${p.marker} ${name}: ${val}
`
+ }
+ return html
+ },
+ },
legend: { data: legendData, top: 0 },
grid: grids,
xAxis: xAxes,