Echarts

Echarts官網，很多圖表等都是我們可以
https://echarts.apache.org/zh/index.html

是百度自己做的圖表，后來用的人越來越多，捐給了orange組織，要想學習看官方就夠了

文檔有教程

此處已經有下載好的最小版了

還有另外一種方法下載，進行在線定制

選完后，上面會有綠色對勾，最下方會有直接下載即可

這個可以根據自己的業務需求進行最小化的定制

生活中一些科研圖表等，也可能會用到此種圖表，用于

所有的可視化最根本的是數據，而可視化效果是js的圖形進行的表示

只要學會一個基本的就能會其他的了

5分鐘上手echarts，官方教程

將echarts.min.js粘貼到下方

此處完全可以直接打開HTML觀察，這個無需打開服務器，只查看測試的話

柱狀圖如下所示

此時第一個示例已經運行完成了

接下來看echarts基礎概念概覽

一個網頁中可以有多個圖表，

系列，在整個圖中某一部分尋找對應關系

相同的數據源可以有不同的表示效果

Option選項，通過里面的參數可以使圖表顯示成自己想要的效果

當我們在實例中看到自己想要的圖標時，可以選擇將里面的代碼復制出來

下面的實例中是可以進行實時修改的

上圖左側的代碼是script中的代碼

應用

使用豆瓣分析的網站演示

如何找到需要修改的參數
通過查看別人的實例，自己進行實時修改，將別人里面的一些東西進行復制到自己的例子中測試其功能

通過看別人的案例，找到自己想要某部分，然后復制更改

樣子選好了，只需要更改里面的data內容就行了，即橫坐標內容，縱坐標的數值

在展示之前，先保證SQL語句的正確

@app.route('/score')                             #訪問根路徑
def score():score_data = []         #評分的種類num_data = []           #每個評分對應的電影數量con = sqlite3.connect("movie.db")  # 連接數據庫，路徑當前路徑cur = con.cursor()  # 游標定義#下方語句可在數據庫測試sql = "select score,count(score) from movie250 group by score"  # 從從數據庫表movie250中查找分數和有多少個分數，按評分進行分組data = cur.execute(sql)for item in data:score_data.append(item[0])  # 得到的數據要保存到列表中，否則后面關閉時會丟失信息num_data.append(item[1])cur.close()con.close()return render_template("score.html",score_data=score_data,num_data=num_data)    #傳遞變量到頁面中

上面的都是數字的形式，直接傳入頁面渲染的
若是列表得到的是字符串形式的，需要在頁面渲染時進行轉換
App.py文件下的

score_data.append(str(item[0]))

html下的變量

data: {{ score_data|tojson }}