大二下學期之第一次結對作業(第一階段)

2022-07-05 15:12:11 字數 4160 閱讀 1481

昨日對flask微型python web框架有了乙個基本了解,並實現了前端與後端資料庫的鏈結。

並將累計確診,累計**,累計死亡,現有確診統計出來了。

今日主要完成對其他各個表的資料與前端的鏈結。

主要問題就是要明白對於echarts的柱狀圖,折線圖,餅狀圖等要傳什麼型別的資料,不然會獲取不了。

還有就是對於資料庫查詢語句的使用問題。

柱狀圖:要傳兩個陣列,乙個是x軸的值,乙個是資料,這裡要以省份為x軸展示各省的確診人數。

需要將資料按省份相加,並按省份生成新錶:

def

get_c2_data():

""":return: 返回各省資料

"""#

因為會更新多次資料,取時間戳最新的那組資料

sql = "

select province,sum(confirm),sum(heal),sum(dead) from details "\

"where update_time=(select update_time from details "\

"order by update_time desc limit 1) "\

"group by province

"res =query(sql)

print

(res)

return res

var bar1_mychart = echarts.init(document.queryselector("

.bar .chart

"));

var bar1_data=[["

河北"],[300]]

var bar1_option =

},grid: ,

xaxis: [,

axislabel:

},axisline:

}],yaxis: [

},axisline:

},splitline:

}}],

series: [

}]};

bar1_mychart.setoption(bar1_option);

window.addeventlistener(

"resize

", function() );

ajax以及後台:

function get_b1_data() ,

error: function (xhr, type, errorthrown) })}

'/b1')

defget_b1_data():

name=

value=

for tup ,v in

utils.get_b1_data():

return jsonify()

效果:

基本每個圖的結構都是:1.前台介面,2.進行前端與後台連線的服務層,3.資料庫層。

折線圖:

var line1_mychart = echarts.init(document.queryselector("

.line .chart

"));

var line1_data =;

var line1_option =,

legend:

//如果series 裡面設定了name,此時圖例元件的data可以省略

// data: ["

郵件營銷

", "

聯盟廣告"]

},grid: ,

xaxis: ,

//修飾刻度標籤的顏色

axislabel: ,

//去除x座標軸的顏色

axisline:

},yaxis: ,

//修飾刻度標籤的顏色

axislabel: ,

//修改y軸分割線的顏色

splitline: }},

series: [,]};

line1_mychart.setoption(line1_option);

window.addeventlistener(

"resize

", function() );

function get_l2_data() ,

error: function (xhr, type, errorthrown) })}

/l2"

)def

get_l2_data():

data =utils.get_l2_data()

day,heal_add,dead_add=,,

for a,b,c in

data:

"%m-%d"))

return jsonify()

def

get_l2_data():

""":return:返回每天新增確診和死亡資料

餅狀圖

var bing1_mychart = echarts.init(document.queryselector("

.pie .chart

"));

var bing1_option =

: (%)",

position: function(p)

},legend:

},series: [,

labelline: ,

data: [,,

,,]}]

};bing1_mychart.setoption(bing1_option);

window.addeventlistener(

"resize

", function() );

function get_r1_data() ,

error: function (xhr, type, errorthrown) })}

def

get_r1_data():

sql='

select city,confirm from'\

'(select city ,confirm from details '\

'where update_time=(select update_time from details order by update_time desc limit 1) '\

'and province not in ("湖北","北京","上海","天津","重慶") '\

'union all '\

'select province as city , sum(confirm) from details '\

'where update_time=(select update_time from details order by update_time desc limit 1) '\

'and province in ("北京","上海","天津","重慶") group by province) as a '\

大二下學期第一次結對作業(第一階段)

今日完成了根據日期查詢不同時間的各省的確診人數 首先是三個輸入框分別輸入年,月,日然後用按鈕繫結乙個點選事件,獲取年月日傳給後台,最後後台將資料庫查詢的結果返回,在渲染圖表。主要 var btn document.getelementbyid query btn.onclick function s...

大一下學期第一次總結

一 學習方面 1.1 寒假期間我再次對前段時間的專案做了優化,比如身份證號中間六位隱藏,使用日期類獲取當前日期等,來學校之後學長仍然發現了許多問題,比如應該用正規表示式判斷身份證號和手機號,使用列舉類寫顧客和管理員,讓我感到還有很大的進步空間 1.2 下階段的學習內容比較多,現在還是起步方面,需要加...

19 20下學期第一次作業問卷調查回答

答 希望自己也能成為 大神寫個遊戲就能讓人們開心好久 答 抱著乙個問題在電腦前敲敲打打直到解決 答 能基礎掌握學習的知識,但是一到一大段 有時候就會很亂 答 作業方面盡全力自己研究,不懂再去問老師同學,課餘時間參加軟體開發類課程與活動,估算目前為止自己寫過的 至少1000 答 這些概念雖然分的清,卻...