球隊戰績的部分想直接秀出來,那就不需要用選單了,直接讓後端傳全部的資料過來就好,所以將app.py
的程式碼改寫一下
@app.route('/get_team_win_stat', methods=['POST'])
def get_team_win_stat():
all_team_stat = {}
team_list = ["中信兄弟", "統一7-ELEVEn", "富邦", "樂天"]
for team in team_list:
stat = get_team_stat(team)
all_team_stat[team] = stat
if stat:
return jsonify(all_team_stat)
else:
return redirect(url_for('index'))
接著前端的ajax也改一下,最主要是將昨天產生data的程式碼包成一個function
function generate_team_data(team_data, team){
let win_percetage = team_data["勝率"].reverse();
let date_list = team_data["時間"];
let date = [];
let data = [];
for(let i = 0; i < date_list.length;i++){
let date_split = date_list[i].split("/");
let t = new Date(date_split[0],date_split[1],date_split[2]);
date.push(t);
}
function generatedata(date, val){
return {
name: date.toString(),
value:[
date,
val
]
};
}
for(let i =0 ; i < win_percetage.length; i++){
data.push(generatedata(date[i],win_percetage[i]));
}
return data;
}
let team_dict = {};
let team_list = ["中信兄弟", "統一7-ELEVEn", "富邦", "樂天"]
for(let i = 0; i < team_list.length; i++){
team_dict[team_list[i]] = generate_team_data(result[team_list[i]]);
}
資料處理好了,把昨天圖的配置項修改一下,並且加入一些標記(使用legend)
option = {
tooltip: {
trigger: 'axis',
},
xAxis: {
type: 'time',
splitLine: {
show: false
}
},
yAxis: {
type: 'value',
splitLine: {
show: false
}
},
legend: {
name: team_list[0],
name: team_list[1],
name: team_list[2],
name: team_list[3],
},
series: [{
name: team_list[0],
data: team_dict[team_list[0]],
type: 'line'
},{
name: team_list[1],
data: team_dict[team_list[1]],
type: 'line'
},{
name: team_list[2],
data: team_dict[team_list[2]],
type: 'line'
},{
name: team_list[3],
data: team_dict[team_list[3]],
type: 'line'
}]
};
legend的name必須要和series中的name一樣
最後是成果圖
明天把表格的資料也爬下來顯示