update pay function
This commit is contained in:
@@ -11,7 +11,8 @@ import {
|
|||||||
useColorMode,
|
useColorMode,
|
||||||
Tooltip,
|
Tooltip,
|
||||||
} from '@chakra-ui/react';
|
} from '@chakra-ui/react';
|
||||||
import { createChart, IChartApi, ISeriesApi, LineData, Time } from 'lightweight-charts';
|
import * as LightweightCharts from 'lightweight-charts';
|
||||||
|
import type { IChartApi, ISeriesApi, LineData, Time } from 'lightweight-charts';
|
||||||
import {
|
import {
|
||||||
FaExpand,
|
FaExpand,
|
||||||
FaCompress,
|
FaCompress,
|
||||||
@@ -70,8 +71,14 @@ const TradingViewChart: React.FC<TradingViewChartProps> = ({
|
|||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (!chartContainerRef.current || data.length === 0) return;
|
if (!chartContainerRef.current || data.length === 0) return;
|
||||||
|
|
||||||
|
try {
|
||||||
|
// 调试信息
|
||||||
|
console.log('🔍 TradingView Chart - 开始初始化');
|
||||||
|
console.log('📦 LightweightCharts 模块:', LightweightCharts);
|
||||||
|
console.log('📊 createChart 函数类型:', typeof LightweightCharts.createChart);
|
||||||
|
|
||||||
// 创建图表 (lightweight-charts 5.0 标准 API)
|
// 创建图表 (lightweight-charts 5.0 标准 API)
|
||||||
const chart = createChart(chartContainerRef.current, {
|
const chart = LightweightCharts.createChart(chartContainerRef.current, {
|
||||||
width: chartContainerRef.current.clientWidth,
|
width: chartContainerRef.current.clientWidth,
|
||||||
height: 500,
|
height: 500,
|
||||||
layout: {
|
layout: {
|
||||||
@@ -119,6 +126,19 @@ const TradingViewChart: React.FC<TradingViewChartProps> = ({
|
|||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// 调试信息
|
||||||
|
console.log('📈 Chart 对象:', chart);
|
||||||
|
console.log('📈 Chart 类型:', typeof chart);
|
||||||
|
console.log('📈 Chart 的方法:', Object.keys(chart));
|
||||||
|
console.log('📈 addLineSeries 存在?', typeof chart.addLineSeries);
|
||||||
|
|
||||||
|
// 检查 chart 对象是否有效
|
||||||
|
if (!chart || typeof chart.addLineSeries !== 'function') {
|
||||||
|
console.error('❌ createChart 返回的对象无效!');
|
||||||
|
console.error('Chart 对象:', chart);
|
||||||
|
throw new Error('createChart 返回的对象没有 addLineSeries 方法');
|
||||||
|
}
|
||||||
|
|
||||||
// 创建折线系列 (lightweight-charts 5.0 标准 API)
|
// 创建折线系列 (lightweight-charts 5.0 标准 API)
|
||||||
const lineSeries = chart.addLineSeries({
|
const lineSeries = chart.addLineSeries({
|
||||||
color: themeColors.primary.gold,
|
color: themeColors.primary.gold,
|
||||||
@@ -135,6 +155,8 @@ const TradingViewChart: React.FC<TradingViewChartProps> = ({
|
|||||||
title: metricName,
|
title: metricName,
|
||||||
});
|
});
|
||||||
|
|
||||||
|
console.log('✅ LineSeries 创建成功');
|
||||||
|
|
||||||
// 转换数据格式
|
// 转换数据格式
|
||||||
const chartData: LineData[] = data
|
const chartData: LineData[] = data
|
||||||
.filter((item) => item.value !== null)
|
.filter((item) => item.value !== null)
|
||||||
@@ -173,6 +195,17 @@ const TradingViewChart: React.FC<TradingViewChartProps> = ({
|
|||||||
window.removeEventListener('resize', handleResize);
|
window.removeEventListener('resize', handleResize);
|
||||||
chart.remove();
|
chart.remove();
|
||||||
};
|
};
|
||||||
|
} catch (error) {
|
||||||
|
console.error('❌ TradingView Chart 初始化失败:', error);
|
||||||
|
console.error('Error details:', {
|
||||||
|
message: error.message,
|
||||||
|
stack: error.stack,
|
||||||
|
LightweightChartsModule: LightweightCharts,
|
||||||
|
createChartType: typeof LightweightCharts.createChart,
|
||||||
|
});
|
||||||
|
// 重新抛出错误让 ErrorBoundary 捕获
|
||||||
|
throw error;
|
||||||
|
}
|
||||||
}, [data, metricName]);
|
}, [data, metricName]);
|
||||||
|
|
||||||
// 时间范围筛选
|
// 时间范围筛选
|
||||||
|
|||||||
Reference in New Issue
Block a user