diff --git a/web/src/components/AdvancedChart.tsx b/web/src/components/AdvancedChart.tsx index b6d4108d..749f42d6 100644 --- a/web/src/components/AdvancedChart.tsx +++ b/web/src/components/AdvancedChart.tsx @@ -98,6 +98,7 @@ export function AdvancedChart({ symbol = 'BTCUSDT', interval = '5m', traderID, + height = 550, exchange = 'binance', // 默认使用 binance onSymbolChange: _onSymbolChange, // Available for future use }: AdvancedChartProps) { @@ -345,8 +346,8 @@ export function AdvancedChart({ if (!chartContainerRef.current) return const chart = createChart(chartContainerRef.current, { - width: chartContainerRef.current.clientWidth, - height: chartContainerRef.current.clientHeight, // Use container height + width: chartContainerRef.current.clientWidth || 800, + height: chartContainerRef.current.clientHeight || height, layout: { background: { color: '#0B0E11' }, textColor: '#B7BDC6', @@ -492,7 +493,7 @@ export function AdvancedChart({ resizeObserver.disconnect() chart.remove() } - }, []) // Removed [height] dependency as we now autosize + }, []) // Chart is created once, ResizeObserver handles dimension changes // 加载数据和指标 @@ -914,12 +915,15 @@ export function AdvancedChart({ borderRadius: '12px', overflow: 'hidden', border: '1px solid rgba(43, 49, 57, 0.5)', + height: '100%', + display: 'flex', + flexDirection: 'column', }} > {/* Compact Professional Header */}
{/* Left: Symbol Info + Price */}
@@ -1076,8 +1080,8 @@ export function AdvancedChart({ )} {/* 图表容器 */} -
-
+
+
{/* OHLC Tooltip */} {tooltipData && (