天天看點

flask+sqlite3+echarts3+ajax 異步資料加載

結構:

/www

|

|-- /static

|....|-- jquery-3.1.1.js

|....|-- echarts.js(echarts3是單檔案!!)

|-- /templates

|....|-- index.html

|-- app.py

|-- create_db.py

一次性整體加載所有資料

由如下函數實作:

此函數用于處理ajax,傳回json格式。形如:

完整app.py檔案:

ECharts3 開始不再強制使用 AMD 的方式按需引入,代碼裡也不再内置 AMD 加載器。是以引入方式簡單了很多,隻需要像普通的 JavaScript 庫一樣用 script 标簽引入。

ECharts3 中實作異步資料的更新非常簡單,在圖表初始化後不管任何時候隻要通過 jQuery 等工具異步擷取資料後通過 setOption 填入資料和配置項就行。

ECharts3 中在更新資料的時候需要通過name屬性對應到相應的系列,上面示例中如果name不存在也可以根據系列的順序正常更新,但是更多時候推薦更新資料的時候加上系列的name資料。

index.html檔案如下:

flask+sqlite3+echarts3+ajax 異步資料加載