前面采集了數(shù)據(jù)，接下來(lái)進(jìn)行可視化并布局到WEB端。爬蟲還有框架scrapy可以用，也有feapder可以用，據(jù)說(shuō)feapder是國(guó)人開(kāi)發(fā)的，也有完整的文檔，有時(shí)間去研究下。

將數(shù)據(jù)布局到WEB端的準(zhǔn)備：

1，前面采集的數(shù)據(jù)，csv，xls，xlsx還有數(shù)據(jù)庫(kù)，任選一樣，或者練手的話都可以做一遍；

2，在pycharm中創(chuàng)建一個(gè)flask項(xiàng)目；

3，準(zhǔn)備一個(gè)網(wǎng)頁(yè)模板，隨便去哪里下，也可以自己寫，下載好之后將靜態(tài)文件如css、js還有圖片文件放在flask項(xiàng)目下的static文件下；將網(wǎng)頁(yè)文件（.html）放在template下；

關(guān)于Flask：

Flask其實(shí)就兩部分，不要去了解底層， 會(huì)用就好。（就像電影中一個(gè)優(yōu)秀的狙擊手，只要會(huì)用狙擊槍狙殺敵人就好，不需要了解槍是怎么制造的。工具黨沒(méi)有什么不好。）

第一部分是解析路由（路徑），就是前段訪問(wèn)服務(wù)器的路徑，都在@app.route('/')語(yǔ)句中，當(dāng)前語(yǔ)句代表訪問(wèn)服務(wù)器的根目錄。

第二部分就是回應(yīng)客戶端響應(yīng)，都定義在@app.route('/some_path')下的函數(shù)里。

關(guān)于可視化：

可視化的第一塊是將電影列表布局到WEB端，第二塊是做一些圖表，柱狀圖餅圖之類的展示數(shù)據(jù)，第三塊是做做一個(gè)詞云。

在下載的網(wǎng)頁(yè)模板中去除自己不想要的部分，這里直接布局到首頁(yè)，也就是只用一個(gè)頁(yè)面，沒(méi)有做鏈接和分頁(yè)。

開(kāi)始操作：

1，在pycharm中創(chuàng)建一個(gè)Flask項(xiàng)目，名字隨便去，開(kāi)啟調(diào)試模式，不然每次更新代碼都要重新啟動(dòng)項(xiàng)目（開(kāi)啟調(diào)試模式可以在創(chuàng)建的時(shí)候開(kāi)啟，也可以在項(xiàng)目的右上角打開(kāi)配置項(xiàng)，開(kāi)啟調(diào)試，如下圖）；

2，將下載的模板根據(jù)上面的準(zhǔn)備工作依次放在指定文件夾；

3，將采集的數(shù)據(jù)放在此項(xiàng)目中的根目錄下，方便操作；

后臺(tái)代碼展示：

首先是從csv讀取數(shù)據(jù)：

前端部分代碼展示：

其實(shí)就全部是HTML代碼。效果如下：

發(fā)現(xiàn)多了一列表頭。將后臺(tái)代碼修正一下：

就是判定了一下行數(shù)，如果是csv里的第一行，就跳過(guò)。

再讀個(gè)數(shù)據(jù)庫(kù)：

效果：

列有錯(cuò)開(kāi)，在數(shù)據(jù)庫(kù)中有個(gè)序號(hào)，可以在前端代碼加一個(gè)單元格<td>展示序號(hào)（也即電影排名）。這里更改后端代碼。

用一行代碼，[x for x in row[1:]]就重構(gòu)了數(shù)據(jù)row。

下一個(gè)應(yīng)該是利用flask + echarts做圖表并布局到WEB端。