strategy_backtest/WEB_VIEWER_README.md

回测结果Web查看器使用说明

📋 功能概述

这是一个基于Flask + HTML/CSS/JavaScript的Web应用，用于可视化和分析A股回测结果。

主要功能

1. 参数优化对比页面

   • 查看网格搜索的所有参数组合结果
   • 按夏普比率、收益率等指标排序
   • 展示最佳参数组合的统计信息

2. 交易明细页面

   • 查看每一笔交易的详细记录
   • 筛选盈利/亏损交易
   • 统计胜率、总盈亏、平均盈亏等

3. 资金曲线可视化

   • 动态图表展示资金曲线走势
   • 同时显示总资产、现金、持仓市值
   • 计算并展示关键指标

🚀 快速开始

1. 安装依赖

pip install flask

2. 启动服务

在项目根目录运行：

python web_viewer.py

3. 打开浏览器

访问：http://localhost:5000

📁 文件结构

strategy_backtest/
├── web_viewer.py          # Flask后端服务
├── templates/
│   └── index.html         # 前端HTML页面
├── static/
│   ├── css/
│   │   └── style.css      # 样式文件
│   └── js/
│       └── app.js         # JavaScript交互逻辑
└── results/               # 回测结果数据
    ├── optimization/      # 参数优化结果
    ├── trades/            # 交易明细记录
    └── equity/            # 资金曲线数据

🎯 使用指南

参数优化对比

1. 在"参数优化对比"标签页，从下拉菜单选择优化结果文件
2. 使用"排序方式"选择不同的排序指标
3. 调整"显示数量"控制表格显示的行数
4. 查看统计卡片了解最佳参数表现

交易明细查看

1. 切换到"交易明细"标签页
2. 选择交易记录文件
3. 使用筛选功能查看全部/盈利/亏损交易
4. 查看每笔交易的详细信息和统计数据

资金曲线分析

1. 切换到"资金曲线"标签页
2. 选择策略的资金曲线文件
3. 查看动态图表，了解资金变化趋势
4. 统计卡片显示关键绩效指标

🎨 特性

• 响应式设计：适配不同屏幕尺寸
• 实时数据加载：自动读取results目录下的最新数据
• 交互式图表：使用Chart.js绘制动态资金曲线
• 数据筛选排序：灵活的数据处理和展示
• 美观界面：现代化的渐变色UI设计

🔧 API接口说明

参数优化相关

• GET /api/optimization/list - 获取所有优化结果文件列表
• GET /api/optimization/<filename> - 获取指定优化结果详情

交易明细相关

• GET /api/trades/list - 获取所有交易记录文件列表
• GET /api/trades/<filename> - 获取指定交易记录详情

资金曲线相关

• GET /api/equity/list - 获取所有资金曲线文件列表
• GET /api/equity/<filename> - 获取指定资金曲线详情

💡 技巧和建议

1. 文件命名：保持results目录下文件的命名规范，方便识别
2. 数据量：资金曲线数据较多时会自动采样，确保图表流畅
3. 刷新数据：点击"刷新数据"按钮重新加载最新文件
4. 多窗口对比：可以打开多个浏览器标签对比不同结果

🐛 故障排除

端口被占用

如果5000端口被占用，修改web_viewer.py最后一行的端口号：

app.run(debug=True, host='0.0.0.0', port=5001)  # 改为其他端口

数据不显示

1. 检查results目录是否存在且包含数据文件
2. 检查CSV文件格式是否正确
3. 查看浏览器控制台和Flask日志的错误信息

图表不显示

确保网络连接正常，Chart.js库从CDN加载。如果网络不佳，可以下载Chart.js到本地使用。

📝 更新日志

v1.0 (2026-01-10)

• ✅ 初始版本发布
• ✅ 实现三大核心功能页面
• ✅ 支持参数优化结果对比
• ✅ 支持交易明细查看
• ✅ 支持资金曲线可视化

👤 作者

A股回测系统开发团队

📄 许可

本项目仅供学习和研究使用。