From 5f12e9d900a23122636e2e9f2c219294df4700ad Mon Sep 17 00:00:00 2001 From: hzm <934585316@qq.com> Date: Wed, 25 Feb 2026 17:43:42 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E6=8A=98=E7=BA=BF=E5=9B=BE=E6=9C=80?= =?UTF-8?q?=E5=8F=B3=E4=BE=A7x=E8=BD=B4=E5=B1=95=E7=A4=BA=E9=97=AE?= =?UTF-8?q?=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- app/assets/github.svg | 4 ++-- app/components/FundIntradayChart.jsx | 10 ++++++++-- app/components/FundTrendChart.jsx | 12 +++++++++--- app/globals.css | 6 +++--- 4 files changed, 22 insertions(+), 10 deletions(-) diff --git a/app/assets/github.svg b/app/assets/github.svg index d02ea0a..c9d822f 100644 --- a/app/assets/github.svg +++ b/app/assets/github.svg @@ -1,4 +1,4 @@ - - \ No newline at end of file + + diff --git a/app/components/FundIntradayChart.jsx b/app/components/FundIntradayChart.jsx index 6fb79a9..c2f01f1 100644 --- a/app/components/FundIntradayChart.jsx +++ b/app/components/FundIntradayChart.jsx @@ -193,10 +193,16 @@ export default function FundIntradayChart({ series = [], referenceNav }) { if (labels && index in labels) { const timeStr = String(labels[index]); const tw = ctx.measureText(timeStr).width + 8; + const chartLeft = chart.scales.x.left; + const chartRight = chart.scales.x.right; + let labelLeft = x - tw / 2; + if (labelLeft < chartLeft) labelLeft = chartLeft; + if (labelLeft + tw > chartRight) labelLeft = chartRight - tw; + const labelCenterX = labelLeft + tw / 2; ctx.fillStyle = prim; - ctx.fillRect(x - tw / 2, bottomY, tw, 16); + ctx.fillRect(labelLeft, bottomY, tw, 16); ctx.fillStyle = bgText; - ctx.fillText(timeStr, x, bottomY + 8); + ctx.fillText(timeStr, labelCenterX, bottomY + 8); } if (data && index in data) { const val = data[index]; diff --git a/app/components/FundTrendChart.jsx b/app/components/FundTrendChart.jsx index 2cefd7c..c45d346 100644 --- a/app/components/FundTrendChart.jsx +++ b/app/components/FundTrendChart.jsx @@ -397,12 +397,18 @@ export default function FundTrendChart({ code, isExpanded, onToggleExpand, trans const value = datasets[datasetIndex].data[index]; if (dateStr !== undefined && value !== undefined) { - // X axis label (date) + // X axis label (date) with boundary clamping const textWidth = ctx.measureText(dateStr).width + 8; + const chartLeft = chart.scales.x.left; + const chartRight = chart.scales.x.right; + let labelLeft = x - textWidth / 2; + if (labelLeft < chartLeft) labelLeft = chartLeft; + if (labelLeft + textWidth > chartRight) labelLeft = chartRight - textWidth; + const labelCenterX = labelLeft + textWidth / 2; ctx.fillStyle = primaryColor; - ctx.fillRect(x - textWidth / 2, bottomY, textWidth, 16); + ctx.fillRect(labelLeft, bottomY, textWidth, 16); ctx.fillStyle = '#0f172a'; // --background - ctx.fillText(dateStr, x, bottomY + 8); + ctx.fillText(dateStr, labelCenterX, bottomY + 8); // Y axis label (value) const valueStr = (typeof value === 'number' ? value.toFixed(2) : value) + '%'; diff --git a/app/globals.css b/app/globals.css index 32c0d4b..48885ab 100644 --- a/app/globals.css +++ b/app/globals.css @@ -1070,10 +1070,10 @@ input[type="number"] { position: absolute; inset: 0; border-radius: 12px; - padding: 2px; + padding: 1.5px; background: conic-gradient( - var(--accent) 0deg, - var(--accent) calc(var(--progress) * 360deg), + var(--primary) 0deg, + var(--primary) calc(var(--progress) * 360deg), var(--border) calc(var(--progress) * 360deg) ); -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);