宛宸. 下午好🌅🌅🌅
本答案参考ChatGPT-3.5
要解决这个问题，你需要按照以下步骤进行操作：
-
添加所需的依赖项：在Flask应用程序中使用ECharts绘制K线数据图，你需要先安装ECharts和flask-echarts库。可以使用pip安装它们：
pip install echartspip install flask-echarts
-
在HTML模板中引入ECharts和flask-echarts库：在test_echarts.html和k_line.html模板中添加ECharts和flask-echarts的CDN链接。
-
修改test_kline路由处理函数：根据你提供的数据截图，你需要将数据截取最后20行的数据并传递给模板。修改test_kline函数如下：
@app.route('/kline')
def test_kline():
date_list = k_line['date'].values.tolist()[-20:]
tar_data = k_line[['open', 'close', 'low', 'high']].values.tolist()[-20:]
# 添加一条MA5均线
ma5 = k_line['close'].rolling(window=5).mean().values.tolist()[-20:]
return render_template('k_line.html', date_list=date_list, tar_data=tar_data, ma5=ma5)
注意，我们通过rolling函数计算了每5个收盘价的平均值，并将结果转换为列表。
- 修改
k_line.html模板：在模板中使用flask-echarts来绘制K线数据图和添加MA5均线。修改k_line.html如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>K Line Chart</title>
<script src="{{ echart.script }}"></script>
</head>
<body>
<div id="k-line" style="width:800px; height:400px;"></div>
<script type="text/javascript">
var chart = echarts.init(document.getElementById('k-line')); // 初始化echarts
var date_list = {{ date_list|tojson }};
var tar_data = {{ tar_data|tojson }};
var ma5 = {{ ma5|tojson }}; // 获取MA5均线数据
var option = {
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross'
}
},
xAxis: {
type: 'category',
data: date_list
},
yAxis: {
scale: true,
splitArea: {
show: true
}
},
series: [
{
type: 'candlestick',
data: tar_data
},
{
name: 'MA5',
type: 'line',
data: ma5
}
]
};
chart.setOption(option); // 渲染图表
</script>
</body>
</html>
在模板中，我们使用echarts.init()函数初始化图表，并将K线数据和MA5均线数据传递给option对象。然后，我们使用chart.setOption()方法渲染图表。
这样，你就能在使用Flask运行应用程序后访问http://127.0.0.1:5050/kline，看到K线数据图并添加了一条MA5均线。
